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 に答える