HTML and CSS Reference
In-Depth Information
To add the border image:
1. Return to the effects.css file in your text editor.
2. At the bottom of the file, insert the following style rule as shown in Figure 8-31:
/* Border image style */
article img {
border-width: 10px;
-o-border-image: url(“borderimg.png”) 50 repeat;
-moz-border-image: url(“borderimg.png”) 50 repeat;
-webkit-border-image: url(“borderimg.png”) 50 repeat;
border-image: url(“borderimg.png”) 50 repeat;
figure 8-31
Adding a border image
sets the width of the
b order to 10 pixels
cuts 50-pixel-wide border slices
from the borderimg.png file;
tiles the top, right, bottom, and
left side images
3. Save your changes to the file.
4. Reload treebook.htm in your Web browser. As shown in Figure 8-32, a torn paper
border image appears around the main photo in the page.
Search WWH ::

Custom Search