【问题标题】: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的,你现在做了两次同样的错误编辑
        猜你喜欢
        • 2011-11-10
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2015-02-09
        相关资源
        最近更新 更多