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



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