Html 我想做一个；“巨无霸”；img

我试图使图像在整个站点上100%拉伸，当我缩小窗口时，图像应该保持居中，并从侧面收缩。以下是我尝试过的：

HTML

---

如果将图像用作背景，则可以将

背景大小

属性与调整整个文档上的div大小结合使用

.full-width {
 position:fixed;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:url(img/large.jpg) no-repeat center center;
 background-size:100% auto;
}

---

您错过了图像上的显示：块（

margin:0 auto

仅适用于块元素）和高度：auto：

。全宽{
宽度：100%；
高度：450px；
边缘底部：50px；
}
.全幅图像{
宽度：75%；
保证金：0自动；
高度：自动；
显示：块；
}

---

仅使用

封面

作为您的

背景尺寸

属性：

.full-width{
    width:100%;
    height:450px;
    margin-bottom:50px;
    background:url(img/large.jpg) 50% / cover;
}

---

50%

将其居中，

用背景图像填充DIV元素。
更改的宽度。全宽img从75%更改为100%。
你的意思是：哦！谢谢你，伙计！这已经困扰了我两天了，我找不到答案，因为我缩小了窗户，图像没有缩小！非常感谢我在使用此属性时遇到一些问题。背景图像不会显示在safari浏览器中。。
.full-width {
 position:fixed;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:url(img/large.jpg) no-repeat center center;
 background-size:100% auto;
}

.full-width{
    width:100%;
    height:450px;
    margin-bottom:50px;
    background:url(img/large.jpg) 50% / cover;
}