[Css] Text Effects

A, text-Shadow (text shadow)

  1, base Usage: text-shadow: 1px 5px rgb 1px (106, 103, 103);

  2, the basic parameters:

  • h-shadow: Required. Horizontal position of the shadow. Allow negative.
  • v-shadow: Required. The vertical position of the shadow. Allow negative.
  • blur: Optional. Fuzzy distance.
  • color: Optional. Color of the shadow.

  3, common text effects

  •   Basis style
.c{
    text-shadow: 1px 1px 5px rgb(106, 103, 103);
}

 

  •  Text Stroke

  When there are four shadow, you can give the text to draw an outline:

.b {

    color: #BBE;
        text-shadow: -1px 0 black, 
                     0 1px black, 
                     1px 0 black, 
                    0 -1px black;
}

 

  •  Neon effect

  Horizontal and vertical value is 0, adding the appropriate unambiguous range, the effect may be achieved neon.

.d {text-shadow: 0 0 0.2em #8F7}
.e {text-shadow: 0 0 0.2em #F87, 0 0 0.2em #F87}
.f {text-shadow: 0 0 0.2em #87F, 0 0 0.2em #87F,
    0 0 0.2em #87F}

 

Guess you like

Origin www.cnblogs.com/yuanyongbin/p/11565206.html