box-shadow兼容性
box-shadow属性值
h-shadow必需。⽔平阴影的位置。允许负值。
v-shadow必需。垂直阴影的位置。允许负值。
blur可选。模糊距离。
spread可选。阴影的尺⼨。
color可选。阴影的颜⾊。请参阅 CSS 颜⾊值。
inset可选。将外部阴影 (outset) 改为内部阴影。
⽬前⽀持的浏览器 IE9+、Firefox 4、Chrome、Opera 以及 Safari 5.1.1；
兼容性写法：
filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=5); /*for ie6,7,8*/ -moz-box-shadow:2px2px5px#969696; /*firefox*/
-webkit-box-shadow:2px2px5px#969696; /*webkit*/
box-shadow:2px2px5px#969696; /*opera或ie9*/
IE兼容的另⼀种写法：
【HTML】
1. <!-- Extra white-space below is just to make it easier to read. :-) -->
2.
3. <!--[if lt IE 7 ]>  <body class="ie6">          <![endif]-->
4. <!--[if IE 7 ]>      <body class="ie7">          <![endif]-->
5. <!--[if IE 8 ]>      <body class="ie8">          <![endif]-->
6. <!--[if IE 9 ]>      <body class="ie9">          <![endif]-->
7. <!--[if (gt IE 9) ]> <body class="modern">      <![endif]-->
8. <!--[!(IE)]><!--><body class="notIE modern"><!--<![endif]-->
【CSS】
1. #box {
2. /* CSS for all browsers. */
3. border: solid 1px #808080;
4. background: #ffffcc;
5. margin: 10px;
6. padding: 10px;
7.
8. /* CSS3 Box-shadow code: */
9.  box-shadow: 5px 5px 0px #ff0000;
10.  -webkit-box-shadow: 5px 5px 0px #ff0000;
11.  -moz-box-shadow: 5px 5px 0px #ff0000;
12. }
13.
14. /* IE6-8 Specific Code */
15. body.ie6 #box,
borderbox16. body.ie7 #box,
17. body.ie8 #box {
18.    zoom: 1;
19.    filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=5, OffY=5, Color=#ff0000);
20. }

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。