CSS Cookbook, 2nd Edition
Problem
You want to place a shadow behind the text in a heading, as shown in Figure 2-41. Figure 2-41. Instant drop shadows on HTML text
Solution
Use the text-shadow property to set the color and placement of the shadow: h1 { font-size: 2.5em; font-family: Myriad, Helvetica, Arial, sans-serif; width: 66.6%; text-shadow: yellow .15em .15em .15em; margin: 0 0 0.1em 0; }
Discussion
The first value of the text-shadow property sets the color. The first length unit value, .15em, moves the shadow on the x-axis relative to the position of the HTML text. The next value moves the shadow on the y-axis. The last value is the blur radius of the shadow. The larger the value the more disperse the shadow. The only known browser that supports the text-shadow property is Safari.
See Also
Read more about the CSS 2.1 specification for text-shadow at http://www.w3.org/TR/REC-CSS2/text.html#text-shadow-props. |
Категории