Internet Explorer -滤镜阴影属性使文本内部难看
Internet Explorer -滤镜阴影属性使文本内部难看
提问于 2012-06-28 17:56:23
我在Internet Explorer(Internet Explorer Explorer 7 Internet Explorer Explorer 8)中有一个带框阴影的div，通过下面的CSS申请。
box-shadow: 0px 0px 15px #FF00CC;
-o-box-shadow: 0px 0px 15px #FF00CC;
-moz-box-shadow: 0px 0px 15px #FF00CC;
-webkit-box-shadow:0px 0px 15px #FF00CC;
zoom: 1;
filter: progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=0),
progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=90),
progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=180),
progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=270),
progid:DXImageTransform.Microsoft.Chroma(Color='#ffffff');
background-color:#FFFFFF;
border:1px solid #FF00CC;它给了它一个方框阴影，但使内部文本变得模糊和丑陋，也就是说，黑色文本正在失去锐度：
如果没有长方体阴影属性，则如下所示：
除了给div一个方框阴影之外，我怎么才能让里面的文字正常呢？
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-06-28 19:53:46
在in 8中，可以通过使用position:relative;在内容中包装一个额外的div来克服这个问题，文本再次获得了它的荣耀：
<div class="shadow-box">
<div style="position:relative;">Lorem ipsum dosectetur adipisicing elit</div>
</div>
.shadow-box {
box-shadow: 0px 0px 15px #FF00CC;
-o-box-shadow: 0px 0px 15px #FF00CC;
-moz-box-shadow: 0px 0px 15px #FF00CC;
-webkit-box-shadow:0px 0px 15px #FF00CC;
zoom: 1;
filter: progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=0),
progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=90),
progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=180),
progid:DXImageTransform.Microsoft.Shadow(Color=#ff99eb, Strength=7, Direction=270),
progid:DXImageTransform.Microsoft.Chroma(Color='#ffffff');
background-color:#FFFFFF;
border:1px solid #FF00CC;
}但在Internet Explorer 7中，如果你使用阴影滤镜，它会删除字体上的cleartype属性，并且根据我的搜索没有任何修复
感谢和。
Stack Overflow用户
发布于 2012-06-28 18:23:12
您可以创建一个带有阴影的空div，并在其上移动其他元素的文本。您可以使用负边距或绝对位置。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11242154
复制相关文章
相似问题
腾讯云开发者
