Arrow
Logo

HTML 5

Introduction to HTML

HTML basic tags

HTML Elements and Attributes

HTML Formatting

HTML phrase tags

HTML Meta tags

HTML Comments

HTML images

HTML Tables

HTML List

HTML Form

HTML Headings

HTML Paragraphs

HTML Line Break

HTML Pre Tag

HTML <hr> Tag

HTML images

AuthorHariom Prajapati

Pubish Date23 Jul 2022

categoryHTML 5

Using HTML image tag we can add/embed image to our web pages.

The image tag ( < img > ) has two attributes which always required

  • src - It is use to specify the path of the image.
  • alt - It  specify an alternate text which describe about image.

 

Syntax -

<img src="url here" alt="alternate text here">

 

For example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Html image tag</title>
</head>
<body>
    <img src="teknowize.png" alt="teknowize">
</body>
</html>

Output

HTML

 

Image Size - Width and Height

We can set width and height of image by CSS but here we see how to set width and height of images using HTML attributes.

 

Syntax -

<img src="url here" alt="alternate text here" width="width range here" height="height range here">

 

For example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Html image tag</title>
</head>
<body>
<p>width is 100 and height is 100</p>
    <img src="teknowize.png" alt="teknowize" width="100" height="100">
</body>
</html>

 

Output

HTML