以下代码适用于过渡文档类型,但在使用严格文档类型时会出现一个小的底部边框。我不明白为什么。
<div class="image"><img width="100" height="100" src="aaa.jpg" title="aaa" alt="aaa" /></div>
div.image {
-moz-box-shadow: 0 0 5px #939393;
-ms-box-shadow: 0 0 5px #939393;
-o-box-shadow: 0 0 5px #939393;
-webkit-box-shadow: 0 0 5px #939393;
box-shadow: 0 0 5px #939393;
padding: 2px;
display: inline-block;
}
任何提示?
Edit1:理想情况下,图像类不能包含高度和宽度信息,因为它必须适合图像大小。
答案 0 :(得分:1)
使用图像大小创建一个图像持有者并隐藏其余部分。
<div class="image">
<div class="imageholder">
<img width="100" height="100" src="aaa.jpg" title="aaa" alt="aaa" />
</div>
</div>
.image {-moz-box-shadow: 0 0 5px #939393;
-ms-box-shadow: 0 0 5px #939393;
-o-box-shadow: 0 0 5px #939393;
-webkit-box-shadow: 0 0 5px #939393;
box-shadow: 0 0 5px #939393;
padding: 2px;
display: inline-block;} // anything, like border, etc.
.imageholder {width: 100px; height: 100px; overflow: hidden;}