{ A destination to learn coding }

Adding Images to your webpage.

roads and city
Photo by Joey Kyber on Unsplash

A single image can say a thousand words.
Images are very common on the websites and almost all the websites include them. Images also makes the webpage look good and appealing.

In html, we can add images to the websites with the help of

<img>
tag.
<img>
tag is an empty element, i.e. it doesnt have a closing tag but contains attributes.

Note: We dont actually insert images in the html script. We give the link of the images to the page.

Following is the syntax for an image tag

			
<img src="URL" alt="Description of image" />

The src attribute contains the source of the image and the alt attribute contains the description of the image.

Try this

<img src="https://goo.gl/vVkqRV" alt="A beautiful parrot" width="300px" />
			

The above example will give you this output
A beautiful parrot
Andrew Pons

The alt attribute

Alt attribute is used to give short description to the image. The alternate text is displayed only if the image fails to load at times of slow net connectivity.
Alternate text also serves as an explaination for the blind people which is read by the screen reader softwares.

The width and height attribute

The width and height attributes are used to define the dimensions of the image. In the above example, the width of the image is 300px and height is not defined. The height attribute by default takes the default value.

Learn
How to make an image responsive

learn css