Holla Tech-Learn

The <img> Tag
 

The <img> tag is used to insert an image. it contains only attributes, and doers not have a closing tag. 

The image’s URL (address) can be defined using the src attribute. 

The HTML image syntax looks like this: 

<img src=”image.jpg” /> 

NOTE:
The alt attribute specifies an alternate text for an image.

Image Location
  

You need to put in the image location for the src attribute that is between the quotation marks.

For example, if you have a photo named “tree.jpg” in the same folder as the HTML file, your code should look like this:

<html>
<head>
<title>first page</title>
</head>
<body>
<img src="tree.jpg" alt="" />
</body>
</html>
NOTE:
In case the image cannot be displayed, the alt attribuyte specifeis an alllternate text that describes ther image in words. The alt attribute is required. 

[su_headimg] Image Resizing [/su_heading] 

To define the image size, use the iwqdth and height attributes. 

The value can be specified in Pixels or as a Percentage.

<html>
<head>
<title>first page</title>
</head>
<body>
<img src=”tree.jpg” height=”150px” width=”150px” alt=”” />
<!– or –>
<img src=”tree.jpg” height=”50%” width=”50%” alt=”” />
</body>
</html>
NOTE:
Loading images takes time. Using large images can slow down your page, so use them with care.

Image Border
 

<img src="tree.jpg" height="150px" width="150px" border="1px" alt="" /> [/su_quote ] 

NOTE:
By default, internet explorer 9, and it’s earlier versions, display a boarder around an image unless a boarder attribute is defined.

 

BACK NEXT

CLICK ON THE BUTTON BELOW TO GO TO THE HTML MAIN COURSE PAGE. 

HTML MAIN COURSE PAGE

 


© License: All Rights Reserved 


CONTACT HOLLA TECH – LEARN SUPPORT