纯CSS3带来的各种阴影效果body{padding: 20px 0 0； font: 14px/1.5 Arial，sans-serif； 文本对齐3360中心； color: #333； 后台： # faf0d 9； }
a{font-weight: bold； color: #346AA8； }
a: hover，a: focus，a : active { text-decoration 3360 none； }
. container { position : relative； z-index: 1； 600px； padding: 20px； margin : 0自动； 后台： # faf0d 9； }
. container : after { content : '； 显示： block； clear: both； 可视：隐藏； height: 0； font-size: 0； }
/* shared styles *.drop-shadow { position : relative； 浮点：左； 40%； padding: 1em； margin: 2em 10px 4em； 后台： # FFf； - WebKit-box-shadow :01 px4 px rgba (0，0，0，0.3 )，00，60 px rgba ) 0，0，0，0.1 ) inset； - moz-box-shadow :01 px4 px rgba (0，0，0.3 )，0
040 px rgba (0，0，0，0.1 ) inset； box-shadow 336001 px4 px rgba (0，0，0，0.3 )、00，40 px rgba (0，0，0，0.1 ) inset； }
. drop-shadow: before， drop-shadow : after { content : '； 位置： absolute； z索引：-2； }
. drop-shadowp { font-size :16 px； 字体权重： bold； }
/* lifted corners *.lifted {-moz-border-radius 33604 px； border-radius: 4px； }
. lifted: before， lifted : after { bottom 336015 px； left: 10px； 50%； height: 20%； max- 300px； - WebKit-box-shadow :015 px 10 px rgba (0，0，0.7 )； - moz-box-shadow :015 px 10px rgba (0，0，0.7 )； box-shadow:015px10pxrgba(0、0、0.7 )； -webkit-transform:
rotate(-3deg )； -moz-transform3360rotate(-3DEG )； - o-transform 3360旋转(-3d eg )； transform:rotate(-3deg )； }
. lifted : after { right :10 px； left :自动； -网络工具包- transform : rotate (3d eg )； - moz-transform 3360旋转(3d eg )； - o-transform 3360旋转(3d eg )； 变换：旋转(3d eg )； }
/* curled corners *.curled { border :1 px固态# efefef； - moz-border-radius 33600120 px 120 px/06 px6px； border-radius 336000120 px 120 px/06 px6px； }
. curled: before， curled : after { bottom 336012 px； left: 10px； height: 55%； max- 200px； - WebKit-box-shadow :08 px 16 px rgba (0，0，0.4 )； - moz-box-shadow :08 px 16 px rgba (0，0，0.4 )； box-shadow :08 px 16 px rgba (0，0，0，0.4 )； - WebKit-transform 3360 skew (-8 deg ) rotate(-4deg )； -moz-transform:
skew(-8deg ) rotate )-4deg； -o-transform3360skew(-8deg ) rotate(-4deg )； transform:skew(-8deg ) rotate )-4deg； }
. curled : after { right :10 px； left :自动； -网络工具包- transform : skew (8deg ) rotate )4deg； -moz-transform3360skew(8deg ) rotate )4deg； -o-transform:skew(8deg ) rotate )4deg； 变换： skew (8deg ) rotate (4deg )； }
/* perspective *.perspective 3360 before { left :80 px； bottom: 8px； 50%； height: 35%； max- 200px； - WebKit-box-shadow :-80px5px 10px rgba (0，0，0.4 )； - moz-box-shadow :-80px5px8px rgba (0，0，0.4 )； box-shadow :-80px5px8px rgba (0、0、0.4 )； -webkit-transform:
skew (50度)； -moz-transform3360skew(50deg )； - o-transform 3360 skew (50度)； 变换： skew (50 deg )； - WebKit-transform-origin :0100 %； - moz-transform-origin :0100 %； -o-transform-origin: 0 100%； transform-origin: 0 100%； }
. perspective : after { display : none； }
/* raised shadow-nopseudo-elements needed *.raised {-WebKit-box-shadow :15 px 10px-10px rgba (0，0，0.5-moz )
040pxrgba(0、0、0、0.1 ) inset； box-shadow 3360015 px 10px-10px rgba (0、0、0、0.5 )、01px4pxrgba、0、0、0.3 )、0、40pxrgba、0、0.1 )
/* curved shadows *.curved : before { top :10 px； bottom: 10px； left: 0； right: 50%； - WebKit-box-shadow :015 px rgba (0，0，0，0.6 )； - moz-box-shadow :015 px rgba (0、0、0、0.6 )； box-shadow:015pxrgba(0、0、0、0.6 )； - moz-border-radius 336010 px/100 px； border-radius: 10px/100px； }
. curved-vt-2: before { right : }
. curved-Hz-1: before { top :50 %； bottom: 0； left: 10px； right: 10px； - moz-border-radius 3360100 px/10px； border-radius: 100px/10px； }
. curved-Hz-2: before { top : bottom: 0； left: 10px； right: 10px； - moz-border-radius 3360100 px/10px； border-radius: 100px/10px； }
/*旋转盒* .旋转{-WebKit-box-shadow : none； -moz-box-shadow: none； 盒- shadow : none； - WebKit-transform : rotate (-3d eg )； -moz-transform3360rotate(-3DEG )； - o-transform 3360旋转(-3d eg )； transform:rotate(-3deg )； }
. rotated : first-child : before { content : '； 位置： absolute； z索引：-1； top: 0； bottom: 0； left: 0； right: 0； 后台： # FFf； - WebKit-box-shadow :01 px4 px rgba (0，0，0，0.3 )，00，60 px rgba ) 0，0，0，0.1 ) inset； - moz-box-shadow :01 px4 px rgba (0，0，0.3 )，0
040 px rgba (0，0，0，0.1 ) inset； box-shadow 336001 px4 px rgba (0，0，0，0.3 )、00，40 px rgba (0，0，0，0.1 ) inset； }
var _gaq=_gaq || []； _gaq.push((_setaccount )、(UA-7489188-1'] ) )； _ gaq.push ([ ' _跟踪页面视图' ]；
(功能() ) {
varga=document.createelement (脚本)； ga.async=true； ga.src=' http://www.Google-analytics.com/ga.js '；
vars=document.getelementsbytagname (' script ' ) [0]；
s.parentnode.insertbefore(ga，s )；
() )；
33558 www.999 jiujiu.com/cssdrop-shadowswithoutimagesliftedcorners
Curled corners
透视
raised盒
单垂直曲线
垂直曲线
单水平曲线
Horizontal curves
旋转盒