At times, you will need to set an image apart from the background or surrounding content to make it stand out. One way to create this effect is to place a border around the image. A border can draw attention to an image and it can be part of a stylistic look throughout a site. Sometimes, a border can also indicate a link. There are two ways to define a borderin this exercise, you'll use CSS to create the border but you'll also learn about the second method of applying the border attribute to the image tag.
Dreamweaver adds a one-pixel border around the image. The border setting uses pixel-based measurement, the default in the Rule Definition dialog box. You can set the width of the border to any number you want. Note You can also apply a border to an image using the border attribute of the <img> tag. To do so, select the image and enter a value for the desired thickness into the Border text field in the Property inspector. If you assign a link to an image, the border color will be the same as the default Link Color specified in Page Propertiesunless a CSS style is applied, in which case a link will not cause any change in the border color. The border color will be the same as the default text color that was specified in the Page Properties dialog box. The following example shows an image that has a border attribute applied through the Property inspector. Avoiding the border attribute in favor of using CSS to define image borders, as you have done in this exercise, is a better coding process. |