CSS resize 图片移动版答案

【问题标题】：CSS resize image mobile versionCSS resize 图片移动版
【发布时间】：2021-04-01 16:46:26
【问题描述】：

我是 html/css 的初学者。我正在为我的网站使用模板。在图像 bennar.jpg 之后，适合浏览器，但在移动视图中，img 未调整为 100%。有人可以帮我解决它吗？非常感谢

    .page-header-area {
  background: rgba(0, 0, 0, 0) url("images/bennar.jpg") center center no-repeat;
  max-width: 100%;
  text-align: left;
  padding: 100px 0;
}

【问题讨论】：

标签： html css

【解决方案1】：

我解决了！仅供参考

背景尺寸：100% 自动；

【讨论】：

【解决方案2】：

.page-header-area {
  background: rgba(0, 0, 0, 0) url("images/bennar.jpg") center center no-repeat;
  min-width:300px;
  max-width: 100%;
  text-align: left;
  padding: 100px 0;
}

【讨论】：

【解决方案3】：

.page-header-area {
  background: url("images/bennar.jpg") center center no-repeat;
  background-size: cover;
  width: 100%;
  text-align: left;
  padding: 100px 0;
}

【讨论】：

我之前也遇到过这种问题，当时我也试了下喜欢的代码。你也可以做诸如“身高：100vw;”之类的。
请注意你的编辑，这个问题stackoverflow.com/questions/65715862/image-is-squeezed-in-flex根本没有使用bootstrap，它是关于talwind的，你现在做了两次同样的错误编辑