Sams Teach Yourself HTML and CSS in 24 Hours (7th Edition)

2017-07-07 02:10:07

This hour has shown you how to use the <img /> tag to place graphics images on your web pages. You learned to include a short text message to appear in place of the image as it loads and to appear whenever someone moves the mouse pointer over the image. You also learned to control the horizontal and vertical alignment of each image and how to make text wrap around the left or right of an image.

Finally, you learned how to take advantage of thumbnail images that link to larger images as means of improving the layout of pages. This required using the same <a> tag introduced in Hour 3. What you didn't see is how to use images as custom page backgrounds, which is coming up next, in Hour 9, "Custom Backgrounds and Colors."

Table 8.1 summarizes the attributes of the <img /> tag covered in this hour, along with relevant style properties.

Table 8.1. HTML Tags and Attributes Covered in Hour 8
Tag/Attribute	Function
`<img />`	Places an image file within the page.

Attributes
`src="address"`	The address or filename of the image.
`alt="altdescription"`	An alternative description of the image that is displayed in place of the image, primarily for users who can't view the image itself.
`title="title"`	A text message that is displayed as an image title, typically in a small pop-up box (tool tip) over the image.
`width="width"`	The width of the image, in pixels.
`height="height"`	The height of the image, in pixels.
	Gets rid of the border around the image if it is serving as a link.
	Aligns the image vertically to `text-top`, `top`, `text-bottom`, `bottom`, `middle`, or `baseline`.
	Floats the image to one side so that text can wrap around the other. Possible values are `left`, `right`, and `none` (default).

Table 8.1. HTML Tags and Attributes Covered in Hour 8

Категории