如何在容器中显示整张图片？
如何在容器中显示整张图片？
提问于 2020-04-21 13:00:15
图像本身是6024x4024。我可以隐藏溢出，但我似乎不能让它在容器中显示完整的图像。我看到的是它在图片上放大了。
.section1{
background-image: url(section1.jpg);
height: 600px;
width: 100%;
overflow: hidden;
object-fit: cover;
}<section>
<div class="section1">
</div>
</section>回答 2
Stack Overflow用户
回答已采纳
发布于 2020-04-21 14:02:49
尝尝这个。background-size:contain;
<html>
<head>
<title>Javascript</title>
<style>
.section1{
background-image: url('../Downloads/1.jpg');
height: 600px;
width: 100%;
background-size:contain;
}
</style>
</head>
<body>
<section>
<div class="section1">
</div>
</section>
</body>
</html>Stack Overflow用户
发布于 2020-04-21 13:10:35
.section1{
background-image: url(section1.jpg);
height: 600px;
width: 100%;
overflow: hidden;
object-fit: contain;
}更改对象-适合包含它将显示整个图像。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61336260
复制相关文章
相似问题
腾讯云开发者
