Question

我遇到了这个问题，我希望html中的图像具有100％宽度的父div，但也有110％的高度。它不起作用。有任何想法吗？

Answer 1

我不知道您的代码有什么问题 - 因为您没有显示它 - 但是这里是一个代码示例，其中包含100％宽度的父div，但也有110％的高度可能对您有所帮助：

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta charset="UTF-8">
        <style>
            html, body { height: 100%; margin: 0; padding: 0; }
            #img-wrapper { border: 5px solid #000; width: 50%; height: 50%; }
            #img { display: block; width: 100%; height: 110%; }
        </style>
    </head>
    <body>
        <div id="img-wrapper">
            <img id="img" src="https://www.helpkidscode.com/pub/wp-content/uploads/2013/08/oskay-hello-world-toast.jpg" />
        </div>
    </body>
</html>

如果图片没有占据整个元素内部，请将display: block添加到带有图像的元素中。
如果图像的父元素似乎没有正确的高度且高度值是百分比，请检查其元素父高度（在示例中，我设置html和body height值以感受屏幕）。

Img宽度100％：高度110％

1 个答案: