最近用了IE6下的滤镜,遇到的几个问题总结:
IE滤镜这个东西以前都没怎么用过,最近在一个项目中用到了阴影的效果。总结了下几个问题
先来CSS样式:
.boxshadow{ border:#0173B1 solid 1px; box-shadow: 2px 2px 3px #003152; -moz-box-shadow: 2px 2px 3px #003152; -webkit-box-shadow: 2px 2px 3px #003152; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#003152'); -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#003152')"; }
HTML结构:
<div class="boxshadow" style="height:100%">设置高度:</div> <div class="boxshadow" style="height:100%; background-color:#FFF;"><span>设置高度,背景色</span></div> <div class="boxshadow"><a href="#">未设置高</a></div> <div class="boxshadow" style="height:100%; text-decoration:none; color:#09C;"><div class="ss" style="background-color:#FFF;">设置高度,内部元素的背景</div></div> <div class="boxshadow" style="height:100%; text-decoration:none; color:#09C;"><span style="background-color:#FFF;">设置高度,内部元素(内联元素)的背景</span></div>
说呈现的效果:
问题有:
1.未设置高度的滤镜无效(无论内部元素是否有高度)
2.如果未设置背景内部元素将继承阴影效果(设置背景后将从下一个子元素开始不继承阴影效果)