Images in HTML

🖼️ HTML Mein Image Kya Hai?

Hindi

Website mein photos, logos, banners aur graphics dikhane ke liye HTML mein <img> tag ka use kiya jata hai.

English

The HTML image element is used to display photos, logos, banners and graphics on a webpage.

🏷️ Image Tag

Hindi

Image add karne ke liye <img> tag use hota hai. Is tag mein image ka path diya jata hai.

<img src="image.jpg">

English

The <img> element is used to add an image. The image file is specified using its path.

📍 src Attribute

Hindi

src ka matlab source hota hai. Isme image file ka naam ya path diya jata hai.

<img src="photo.jpg">

English

The src attribute specifies the location or path of the image file.

♿ alt Attribute

Hindi

alt ka use image ka alternative text dene ke liye hota hai. Agar image load na ho to ye text useful hota hai.

<img src="logo.png" alt="OMI Logo">

English

The alt attribute provides alternative text that describes the image.

📁 Image File Ka Path

Hindi

Agar image aur HTML file same folder mein hain, to sirf image ka naam likh sakte hain.

<img src="photo.jpg" alt="My Photo">

Agar image kisi folder ke andar hai, to folder ka naam bhi path mein likhna hoga.

<img src="images/photo.jpg" alt="My Photo">

English

If the image is inside another folder, include that folder in the image path.

📏 Image Size

Hindi

Image ki width aur height HTML attributes se bhi set ki ja sakti hai.

<img src="photo.jpg"
     alt="My Photo"
     width="300"
     height="200">

English

The width and height attributes can be used to define the displayed size of an image.

💻 Complete Example

Hindi

Ek simple webpage mein image ko is tarah add kar sakte hain:

<!DOCTYPE html>

<html>

<head>

    <title>My Website</title>

</head>

<body>

    <h1>My Website</h1>

    <img src="photo.jpg"
         alt="Website Photo"
         width="400">

    <p>
        Welcome to my website.
    </p>

</body>

</html>

English

This example creates a heading, displays an image and adds a paragraph below it.