NOTICE: This website is no longer updated or supported - as such many of the techniques used to build it may seem antiquated in the modern day. It is preserved for historical reasons only.

HTML XHTML The Complete Reference
home » reference » appendix b » css1 / css2 properties

text-shadow


This as yet unimplemented CSS2 property sets a shadow effect for text. The shadow is defined by a comma-separated list of shadow effects to be applied to the text of the element. The shadow effects are applied in the order specified and may overlay each other, but they will never overlay the text itself. Each shadow effect must specify a shadow offset and may optionally specify a blur radius and a shadow color.

A shadow offset is specified with two length values usually in absolute measurement that indicate the distance from the text. The first length value specifies the horizontal distance to the right of the text. A negative horizontal length value places the shadow to the left of the text. The second length value specifies the vertical distance below the text. A negative vertical length value places the shadow above the text. An optional blur radius may be specified after the shadow offset. The blur radius is a length value that indicates the boundaries of the blur effect. A color value may optionally be specified before or after the length values of the shadow effect. The color value will be used as the basis for the shadow effect. If no color is specified, the value of an inherited color property is used.

Examples


h3 {text-shadow: 0.2em 0.2em; }
/* shadow to right and below */
span {text-shadow: 3px 3px 5px red; }
/* red blurry shadow right and below */
.solar{background: white; color: white; text-shadow: black 0px 0px 5px;}
/* sets an outline effect on the text */

Browser and CSS Support Notes


CSS2
No IE support
No Netscape or Mozilla support
No Opera support

(X)HTML Elements
CSS Properties
Back: text-indent Next: text-transform
< Home | About | Chapters | Examples | Errata | Reference | Site Map >