Html css响应背景图像未显示

当没有指定固定的高度和宽度时，我无法显示图像。我希望我的图像能够灵活响应我的网格，所以我认为可以将高度和宽度设置为100%，但没有效果

如何使图像显示并能够相应地更改大小

HTML

尝试添加到css：

.hero img {width:100%;}

您必须将样式添加到img it self，而不是container div。试一试：

html {
    min-height: 100%;
    background-size: cover;
    background-image: url(steve1.png);
    background-repeat: no-repeat;
    background-position: right bottom;
}
body{
    min-height:100%;
}

---

我没有看到背景图像。您是否尝试过将宽度和高度应用于

#image

而不是容器

.hero

？您也可以使用媒体标签构建您的网站。

.hero img {width:100%;}

html {
    min-height: 100%;
    background-size: cover;
    background-image: url(steve1.png);
    background-repeat: no-repeat;
    background-position: right bottom;
}
body{
    min-height:100%;
}