• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 10. Text Properties > text-shadow Property

10.9. text-shadow Property

The text-shadow property does exactly what it describes — it adds a background shadow to the selected text. This shadow can appear behind and to the left or right of the text, or even in front of the text. Since it is a “shadow,” the shadow never actually overlays the text itself, although the shadow may overlay itself, depending on how sharp or how blurry you make the ends of the shadow. According to the CSS specification, the shadow does not extend the box of its Web element, and it can therefore overlay any text that may lie immediately adjacent to the affected text.

There are several different combinations of values that can be set for text-shadow. There are two different space-separated values that set how much the shadow is offset from the text. The first number sets the horizontal length of the shadow from the text, and the second number does the same for the vertical length. By default, the first numeric value sets the shadow to the right of the text, and the second numeric value sets the shadow below the text. text-shadow can accept negative values for these as well, so it is possible to set the shadow to the left and above the text by using negative values. text-shadow can take a third numeric length value, which sets the amount of “blur” at the boundaries of the shadow. How this should work is not explicitly stated in the CSS2 specification, so results may vary from browser to browser if and when this property is implemented.


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint