CSS3--Text Shadow (Text-shadow)

Text-shadow in the CSS2, but in the css2.1 version was abandoned, and now css3.0 version has been re-picked back.

It functions to produce shadows and blur the subject. This adds texture to the text when you don't use the picture.

1, Text-shadow syntax, value

 Text-shadow:none | <  length  >  None | [<  shadow  > ,] * <  shadow  >  or none | <  color  >  [, <  color  >  ]* that is: text-shadow:[color (color) x axis (x offset) y axis (y offset) fuzzy radius (Blur)],[color (color) x-axis (x Offset) y-axis (y Offset) blur radius (Blur)] ... or text-shadow:[x axis (x offset) y axis (y offset) blur radius (Blur) color (color)],[x axis (x offset) y axis (y offset) blur radius (Blur) color (color)]... 

Value: < length > : The length value, which can be negative. Used to specify the extension distance of the shadow. where x offset is the horizontal offset value, and Y offset is the vertical offset value;<color>: Specifies the shadow color, or it can be an rgba transparent color;  <Shadow>: The blur value of the shadow, which can not be negative, is used to specify the effect distance of the blur effect.

2, Text-shadow description

Description: You can apply one or more sets of shadow effects to an object, as shown in the previous syntax, separated by commas.
Text-shadow:x-offset Y-offset Blur Color;
X-offset represents the horizontal offset distance of the shadow, when the value is positive and the shadow is shifted to the right, and if its value is negative, the shadow shifts to the left;
Y-offset refers to the vertical offset distance of the shadow, and if its value is positive, the shadow is shifted downward and the shadow is shifted to the top when its value is negative.
Blur is the degree to which a shadow is blurred, its value cannot be negative, and if the value is larger, the shadow becomes blurred, and the shadow becomes clearer, and if shadow blur is not required, the Blur value can be set to 0;
 color refers to the shadow's colour, which can use the RGBA color.

3, Text-shadow compatible

= = = IE is not supported Text-shadow effect, ( use filter Filter:shadow to process)

Filters (which do not promote filters) are similar to DropShadow, and can use objects to produce a shadow effect, unlike Shadow, which produces an asymptotic effect and is smoother with shadows.

Filter Syntax:  E {filter:shadow (color= color value, direction= value, strength= value)}
-------
Color is used to set the shadow color of an object;
The direction is used to set the main direction of the projection, the value is 0 that is zero degrees (indicating upward orientation), 45 for the right, 90 for the right, 135 for the lower right, 180 for the lower, 225 for the lower left, 270 for the left, and 315 for the top.
Strength is the intensity, similar to the blur value in Text-shadow.

4. Text-shadow Usage

Example Click to view: To be added

Organize from:(w3cplus) CSS3 text Shadow-text-shadow

CSS3--Text Shadow (Text-shadow)