1

请看看这个jsfiddle

<!DOCTYPE html>
<html lang='en'>
<head> 
    <style>
        body { height: 100%; margin: 0; padding: 0;}
        div { height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; background: black;}
        img { height: 100%;}
    </style>
</head>

<body>
    <div><img src='https://upload.wikimedia.org/wikipedia/commons/8/85/Smiley.svg'></div>
</body>
</html>

即使将 和 都设置为 100% 的高度，底部仍然几乎没有多余的空间导致滚动条。有谁知道是什么导致了这个空间？

我只想知道行为。

谢谢！

4

1 回答 1

4

该img标签是一个内联标签，您看到的额外空间是由于这个原因。添加display:block到图像的样式。

于 2013-04-01T15:48:39.373 回答