HTML & XHTML Image Tutorials
Now let’s talk about how to add inline images to an HTML or XHTML document. You will do this by using the <img> tag, which displays an inline image. An inline image is an image that is inserted into the current text flow of your HTML or XHTML document, which has no implied line or paragraph break before or after the <img> tag, that is why the images are called inline. The <img> tag requires no end tag in HTML but in XHTML, it is required, since the <img> tag is an empty tag, which means it has no end tag you will either have to include an end tag the normal way, for example <img></img> or the shorthand way, for example <img /> both of which are acceptable for XHTML.
Read More ››Now let me show you how to add external images to an HTML or XHTML document. External images are images that don’t appear like inline images on a web page. Instead, they are images that are referenced externally and viewed on another page when clicked.
Read More ››Now let me show you how to make a thumbnail image, which will be used as a link to the larger external image. In order to make the thumbnail image you will need an image editor to resize the image to a smaller size, I used Photoshop CS to resize my image or you can use the <img> tags width and height attributes, you will have to give the size of both attributes values in pixels, for example, a pixel value of 75px.
Read More ››Now let me introduce you to the <hr> tag also known as the horizontal rule. The <hr> tag is considered to be a graphic element, because the <hr> tag inserts a horizontal rule across the display window.
Read More ››What if you want to add an image to the background of your web page, this is where the <body> tags background attribute steps up.
Read More ››What if you want to change the background color of your web page, you will then have to use the <body> tags bgcolor attribute. The bgcolor attribute can have either a hexadecimal RGB color value or a color name value, which I will explain in another tutorial. Now if you where to combine the bgcolor attribute with the background attribute the bgcolor attributes value will show through the transparent parts of the image if any. The bgcolor attribute has been deprecated in favor of the CSS background: and background-color: properties.
Read More ››What if you want your images to download faster for your users, in order to do so you will have to include the width and height attributes for the <img> tag. The values for the width and height attributes should always be in pixels, for example width=”400px”.
Read More ››