To add an image to an HTML page, you can use the <img> tag. Here’s how to do it step by step:
-
Choose Your Image: Make sure you have the image file you want to display. It can be a local file or an image hosted online.
-
Use the
<img>Tag: The<img>tag is used to embed images in your HTML document. You need to specify thesrcattribute (source) to point to the image file and thealtattribute (alternative text) to describe the image.
Here’s an example of how to add an image:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Image Example</title>
</head>
<body>
<h1>My Image Page</h1>
<img src="path/to/your/image.jpg" alt="Description of the image" />
</body>
</html>
Explanation:
src: This attribute specifies the path to the image file. It can be a relative path (likeimages/logo.png) or an absolute URL (likehttps://example.com/image.jpg).alt: This attribute provides a text description of the image, which is important for accessibility.
Example with a Local Image:
If you have an image named logo.png in a folder called images, your code would look like this:
<img src="images/logo.png" alt="Company Logo" />
Example with an Online Image:
If you want to use an image from the web, you can do it like this:
<img src="https://example.com/image.jpg" alt="Example Image" />
Make sure to replace the src value with the actual path or URL of your image.
