Recomendados
Más contenido relacionado
Similar a HTML IMG Tag Guide: How to Add Images to Web Pages
Similar a HTML IMG Tag Guide: How to Add Images to Web Pages (20)
Último
Último (20)
HTML IMG Tag Guide: How to Add Images to Web Pages
- 1. Web Design 2830 How to use the HTML tag IMG By Andy Garcia
- 2. Why put images on your webpage?
- 3. The Code <img src="website.jpg " alt="Image name " />
- 4. The Code <img src="website.jpg " alt="Image name " /> Img: Tells the browser that there is an image in the html document.
- 5. The Code <img src="website.jpg " alt="Image name " /> Img: Tells the browser that there is an image in the html document. src: is the source where the image will come from, this is where you would put the wed address of the image.
- 6. The Code <img src="website.jpg " alt="Image name " /> Img: Tells the browser that there is an image in the html document. src: is the source where the image will come from, this is where you would put the wed address of the image. alt: Sometimes the person viewing your page may not be able to view the image, this alternative description gives the viewer a description of the image.
- 7. How do I use this code? • First lets get the code into a text editor.
- 8. How do I use this code? • Browse the internet and copy the image url.
- 9. How do I use this code? • Paste the url into the first set of quotes in the code.
Notas del editor
- Hello Class my name is Andy Garcia and today I will be teaching you how to use the img tag to place images into your web page.
- Images have many functions on a web page. They can be used to indicate the website the viewer is on, such as a logo. It can be used to provide a visual to context on the page. Or to just add some to make the page look fun and cool!
- .
- In order to place an image into your web page, you will need to use this html code. Let’s break down the different tags used in this code to generate an image on your web page.First img.Img: Tells the browser that there is an image in the html document.src: is the source where the image will come from, this is where you would put the wed address of the image.alt: Sometimes the person viewing your page may not be able to view the image, this alternative description gives the viewer a description of the image.The tag can be used alone in a text editor, when you open the code in browser you will see the stand alone image.Notice that the img tag is not close again with the img hash tag, just once with a hash tag.
- First lets get out code into the text editor, if you put the code into note pad, you will be able to save it as a index.html and open it as a web page later.
- Now lets browse the internet to find an image, I searched for a Korean Girl band called After School.Since I use a PC I right click the image and copy the image url.
- Paste the url into the first set of quotes, which will generate the image in the html code. In the second set of quotes put a description of the image. I put After School as the title.Finally Save the code and see what the image looks like on your web page!
- And there you have it! The img tag in action! I hope you all learned how to use this tag and how useful it will be for you as you progress in your web design skills. Please ask me for help if you ever need it!