1.

How to insert a image in a web page

Answer» Let’s pretend we have an image of a dog on our computer saved as “funny-dog.jpg” and we want to insert it into a webpage; this is the code we would use:\t1<img\xa0src="funny-dog.jpg">\tLet’s analyze this code. First,\xa0\xa0is the code for creating an image element. Next, the letters “src” are used as an attribute\xa0and stand for “source”. Basically, we need to provide the web browser with a\xa0value\xa0to the source of the image. Naturally, the\xa0value\xa0for the source\xa0attribute\xa0is “funny-dog.jpg”. This example assumes your image file is located in the same directory as your HTML file. If, for example, you had your image file inside a folder named “images” your code would look like this:\t1<img\xa0src="images/funny-dog.jpg">\tSelf Closing ElementsAs you can see, in both code examples so far there has\xa0not\xa0been an ending\xa0\xa0tag, because the image code is a “self closing” element. This is because unlike a paragraph, we won’t have a plethora of content inside our element, but rather a single image. In fact, HTML5 does not require us to ever “close” our elements, but for organizational reasons I recommend including traditional closing tags for most elements.There is one additional bit of code we must add before we are finished. We must assign an “alt” attribute and value to our image. The “alt” attribute stands for “alternative” and is used to provide a text-based alternative for viewers incase the image will not load, or if they are visually impaired. Here is what our code will look like:\t1<img\xa0src="funny-dog.jpg"\xa0alt="A funny dog sitting on the grass.">\t


Discussion

No Comment Found

Related InterviewSolutions