HTML Images Syntax
In HTML, images are defined with the
<img>
tag. The <img> tag is empty, it contains attributes only, and does not have a closing tag. The
src attribute
specifies the URL (web address) of the image: <img src="url"
alt
="some_text">
The alt attribute
specifies an alternate text for an image, if the image cannot be displayed. Also use width and height attributes. Here, the values are specified in pixels by default: Example <img src="html5.gif" alt="HTML5 Icon" width="128" height="128"> Width, height, and style attributes are valid in HTML5 standard.
<img title="html" src="images/1.jpg" alt="HTML" height="180" width="280" >
HTML perch <img title= "perch" src="images/abborre.jpg" alt="perch" height="132" width="199"> Here css is used to float the image to the right. <img style="float: right; margin: 0px 15px 15px 0px;" src="images/tibet.jpg" "width="100" height= "100";/>


The
width and height
attributes are necessary because if they are excluded, the browser will tend to calculate the size as the image loads, instead of when the page loads, which means that the layout of the document may jump around while the page is loading. The
alt
attribute is the alternative description. Note that, like the br tag, because the img element does not enclose any content, no closing tag is required. The most commonly used file formats used for images are jpg, gif, and png. .jpeg or .jpg stands for Joint Photographic Experts Group. .gif stands for General Image Format. .png = Portable Network Graphics To save an image place the mouse pointer anywhere on the image and right click it, then select save image...
Image border:
Use CCS to make borders - like this: <img src="images/tibet.jpg" alt="tibet"style="border:5px solid black"; height="108" width="100"> tibet
Image link:
<a href="indexht.html"><img src="images/tibet.jpg" alt="tibet" height="108" width="100"></a>
tibet
Click me
Image Maps:
Use the
<map>
tag to define an image-map. An image-map is an image with clickable areas. The name attribute of the <map> tag is associated with the <img>'s usemap attribute and creates a relationship between the image and the map. The <map> tag contains a number of <area> tags, that defines the clickable areas in the image-map: <img src="colors.gif" alt="colors" usemap="#colormap" style="width:155px;height:130px;"> <map name="colormap"> <area shape="red" coords="0,0,80,126" alt="red" href="red.htm"> <area shape="circle" coords="90,57,3" alt="circle" href="circle.htm"> <area shape="circle" coords="125,58,8" alt="blue" href="blue.htm"> </map> coord

html5