HTML and CSS Reference
In-Depth Information
Table 4.2 Attributes of the <img /> tag
right , left (default), top , middle , bottom (Deprecated)
Text phrase that describes the image
Image border size in pixels (Deprecated) 0 will prevent the border from being displayed.
Height of image in pixels
Amount of space that is blank to the left and right of the image in pixels (Deprecated)
Text name, alphanumeric, beginning with a letter, no spaces—the value must be unique and not used
for other id values on the same XHTML document
URL of a Web page that contains a text description of the image
Text name, alphanumeric, beginning with a letter, no spaces—this attribute names the image so that it
can be easily accessed by client-side scripting languages such as JavaScript. This attribute is depre-
cated in XHTML but is used to provide backward compatibility with browsers that support HTML.
The URL or file name of the image
A text phrase containing advisory information about the image—typically more descriptive than the
alt text
Amount of space that is blank above and below the image in pixels (Deprecated)
Width of image in pixels
Use height and width attributes to help the browser render your page more efficiently.
If you omit the attributes, the browser must often adjust and shift the other page ele-
ments after your images load. This slows down the loading of your Web page. The
browser reserves the correct amount of space for your image if you use the height and
width attributes with values either equal to or approximately the size of the image.
What if I don't know the height and width of an image?
Most graphics applications can display the height and width of an image. If you have a graph-
ics application such as Adobe Photoshop or Adobe Fireworks handy, launch the application
and open the image. These applications include options that will display the properties of the
image, such as height and width.
If you don't have a graphics application available, you can determine the dimensions of an
image using a browser. Display the image on a Web page. Right-click on the image to display
the context-sensitive menu. Select properties and view the dimensions (height and width) of the
image. ( Warning : if the height and width are specified on the Web page, those values will be
displayed even if the image's actual height and width are different.)
Accessibility and Images
Use the alt attribute to provide accessibility. Recall from Chapter 1 that Section 508 of
the Rehabilitation Act requires the use of accessibility features for new information
Focus on Accessibility
Search WWH ::

Custom Search