Css3.0 preemptive viewing (4): Box-shadow creates a cool blur shadow

ArticleFromWww.css3s.cn

The background and border modules of css3.0 Add a cool attribute box-shadow. Obviously, the name can be used to guess the shadow effect. Currently, it can only be supported by the safari3 browser. After reading the example below, we can see what is going on.

Example 1:

Safari 3Users can see 5 pixels of blurred back here

CSSCodeAs follows:

-WebKit-box-Shadow: 10px 10px 5px #888; padding: 5px 5px 5px 15px;

Note:-WebKit-box-Shadow: 10px 10px 5px # The parameters in 888 indicate the shadow horizontal offset values (positive and negative values are recommended. In this example

10px); shadow vertical offset value (positive and negative values are acceptable, 10 Px in this example); shadow blur value (5px in this example); shadow color (#888 in this example ).

Example 2:

Safari 3Users can see the pure black back here
 
The CSS code is as follows:
-WebKit-box-Shadow:-10px-10px 0px #000;-WebKit-border-radius: 5px; padding: 5px 5px 5px 15px;
Article fromWww.css3s.cn