clock  Mon - Sun 8.00 AM - 8.00 PM
mail  edu@teknowize.com
fb
instagram
play store
pinterest

More

HTML images

Imperial Advance Hero Image

HTML images

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 herewidth="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

HTML 5