以下代码适用于我的所有图片,但是,当我在 html5画布容器上使用它时,它会在实际阴影之前显示一个奇怪的白色区域。
CSS:
#container{
width: 500px;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
border-bottom-left-radius: 2px;
margin: 0px;
padding: 0px;
-webkit-box-shadow: 0 8px 6px -6px black;
-moz-box-shadow: 0 8px 6px -6px black;
box-shadow: 0 8px 6px -6px black;
}
HTML:
<div id="container"></div>
结果:http://i.imgur.com/0uk5yVQ.png
有谁知道如何解决这个问题?我从http://css-tricks.com/snippets/css/css-box-shadow/
获取了原始代码答案 0 :(得分:3)
这是因为默认情况下图像是内联的。如果您向其添加display: block;
,则空格将消失。像这样(http://jsfiddle.net/skip405/tFUPU/2/
#container img {
display: block;
}