We know that in the CSS3 Box-shadow is a box shadow style word, then we will see today Box-shadow how to use, the following to bring a small case column
Box Shadow Style Word: Box-shadow
Grammar
div{box-shadow:0 0 1px #000 inset;}
Represents the border spacing left 0 on top 0 and 1px shadow range shadow color is black (#000), there is inset for the inside of the box, without inset for the outer shadow.
Attention:
box-shadow:0px 0px 1px #000
The 1th value is 0 o'clock, which represents a 1px range for the left and right border shadows
The 1th value is a positive integer representing the left border shadow
The 1th value is a negative integer representing the right border shadow
Similarly
A 2nd value of 0 represents the top and bottom border shadow
The 2nd value is a positive integer representing the 1px shadow distance above the border how much
The 1th value is a negative integer that represents the bottom border shadow setting
Set the inner and outer shadows for the div box and picture img separately for the case.
1. Case HTML code
<! DOCTYPE html>
2. Case CSS Code
. box {box-shadow:5px 2px 6px #000 inset; width:300px; height:80px; margin:0 auto}. box2 img {box-shadow:5px 2px 6px #000}
CSS3 in the Box-shadow usage is so many, more wonderful please pay attention to the PHP Chinese network other related articles!
Related reading:
What about the overlap between the HTML div?
What is the difference between br,p and div in HTML?
How to use the absolute and relative paths of HTML