纸张阴影(来自@张鑫旭老师)

前端之家收集整理的这篇文章主要介绍了纸张阴影(来自@张鑫旭老师)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

<table class="html5"><tr class="li1">
<td class="ln"><pre class="de1">1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

> .curved_Box {     display: inline-block;     *display: inline;     width: 200px;     height: 248px;     margin: 20px;     background-color: #fff;     border: 1px solid #eee;     -webkit-Box-shadow: 0 1px 4px rgba(0,0.27),0 0 60px rgba(0,0.06) inset;     -moz-Box-shadow: 0 1px 4px rgba(0,0 0 40px rgba(0,0.06) inset;     Box-shadow: 0 1px 4px rgba(0,0.06) inset;     position: relative;     *zoom: 1; }   .curved_Box:before {     -webkit-transform: skew(-15deg) rotate(-6deg);     -moz-transform: skew(-15deg) rotate(-6deg);     transform: skew(-15deg) rotate(-6deg);     left: 15px; } .curved_Box:after {     -webkit-transform: skew(15deg) rotate(6deg);     -moz-transform: skew(15deg) rotate(6deg);     transform: skew(15deg) rotate(6deg);     right: 15px; }   .curved_Box:before,.curved_Box:after {     width: 70%;     height: 55%;     content: ' ';         -webkit-Box-shadow: 0 8px 16px rgba(0,0.3);     -moz-Box-shadow: 0 8px 16px rgba(0,0.3);     Box-shadow: 0 8px 16px rgba(0,0.3);         position: absolute;     bottom: 10px;     z-index: -1;     } > Box"><>

猜你在找的程序笔记相关文章