In this section, we’ll explore how to insert an image onto our web page.
Remember at the beginning of the course, in the lesson dedicated to site organization, I advised you to create a folder named images in the main directory of your site? Well, now you’ll need it! The first thing to do is choose the image you want to insert on your page and, once selected, place it in the site’s images folder using copy and paste. Choose any image. Now let’s look at how to insert this image, or your chosen image, using HTML:
<img src="images/stones.gif">
Now, let’s break it down. The img tag stands for image and is written in its abbreviated form. Combined with src, which means source, it tells the browser where the image is located.
The command is followed by the path that will lead the browser to find and display the image stones.gif. The img tag does not require a closing tag! Let’s carefully analyze the path: “images/stones.gif”. Images is the folder you created earlier, which contains the image to be displayed.
The forward slash / is used to indicate that this is a path. Finally, we have the image to be displayed: stones.gif. When we cover the lessons on links, we will learn how to upload an image directly from the web without placing it in any site folder.
Pubblicato in HTML & CSS
Be the first to comment