Javascript AJAX jQuery HTML PHP Example MORE

HTML Image tag with Example

web is not just about text, its multi-media and HTML's multimedia features allow you to include images, audio clips, video clips, and other. <img> element, used to embed a simple image in a webpage.

Images can improve the design and the appearance of a web page.

Syntax:

<img src="url" alt=”text”>

Example:

<!DOCTYPE html>
<html>
<body>
    <img src="sun-rise.jpg" alt="Sun Rise">
</body>
</html>

Run it yourself

Note:Like <br> , the <img> element is also an empty element, and does not have a closing tag. In XHTML it closes itself ending with "/>". Src Attribute:

Every image has a src attribute (src stands for source). The src attribute tells the browser where to find the image you want to display.

It's telling the browser where to go to find the image. Again, it's best for you to place the images you want to use in a subdirectory called "images".

Alt:

Alt stands for "alternate text". This tells the browser that if it can't find the image, then just display this text.

Image Size - Width and Height:

The width and height attributes are used to specify the height and width of an image.

Syntax:

<img src="url" alt=”text"width="in pixels”height="in pixels">

Example

<!DOCTYPE html>
<html>
<body>
    <img src="sun-rise.jpg" alt="Sun Rise" width="400px" height="450px">
</body>
</html>

Run it yourself

You can change the height width by using style.

Example:

<!DOCTYPE html>
<html>
<body>
    <img src="sun-rise.jpg" alt="Sun Rise" style="width:400px;height:450px;">
</body>
</html>

Run it yourself