Scribd
Upload
4 views2 pages

Gp HTML Images

The document explains how to display images in HTML using the <img> tag, which is a self-closing tag. It details the use of the src attribute to specify the image source, the alt attribute for alternate text, and how to set image dimensions with height and width attributes. Additionally, it mentions that images can be sourced directly from the browser using a URL.

Uploaded by

sodohe3963
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
4 views2 pages

Gp HTML Images

The document explains how to display images in HTML using the <img> tag, which is a self-closing tag. It details the use of the src attribute to specify the image source, the alt attribute for alternate text, and how to set image dimensions with height and width attributes. Additionally, it mentions that images can be sourced directly from the browser using a URL.

Uploaded by

sodohe3963
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

IMAGES IN HTML

Overview
With HTML you can also display images in a document. In HTML, images are defined
with the <img> tag.

❖ <img> tag is a self-closing tag which means that it doesn't contain the closing
tag.

src Attribute
src stands for "source". The value of the src attribute is the URL of the image you want
to display on your page.

❖ The src tag can contain both relative and absolute paths, as well as internet
image links.

Syntax : <img src="images/logo.png">

Browser :

alt Attribute
The alt attribute or alternate text tells the reader what they are missing on a page if
the browser can't load images. The browser will then display the alternate text instead
of the image.

Syntax : <img src="images/logo.png" alt="Coding Ninjas image">

Browser :

1
Height and Width
The height and width of an image can be set directly by using the height="value" and
width="value" attributes. By default, the value provided is in pixels.

Example :
<img src="images/logo.png" alt="Coding Ninjas image" height="500" width="500">

● This will fix the height and width of the image to 500px(pixel).
● There is an alternate for height and width attributes in CSS. We will come to this
later.

NOTE : Value provided should be in numerical form. Pixel is a unit of measurement to


set the dimensions of the image.

Images directly from the browser


You can also directly use the image address from the browser

Example : <img src = “https://files.codingninjas.in/0000000000000723.jpg”>

Browser :

You might also like