【问题标题】:background-size: cover only fits width背景尺寸:封面只适合宽度
【发布时间】:2014-08-30 14:39:02
【问题描述】:

我有一个“水平”图像作为背景(它是 2048x1148)。

我设置了background:url("") no-repeat scroll center top / cover,在桌面模式下一切正常。在移动设备中,虽然我无法缩放背景图像并自动覆盖高度。 background-size:cover不应该自动做吗?

Here 是实时站点。

【问题讨论】:

    标签: html css background-image background-size


    【解决方案1】:

    让您的页面覆盖孔视口:

    html, body{
       height: 100%;
    }
    

    或使用min-height

    【讨论】:

    • 谢谢大家。是不是很容易……我总是忘记检查视口样式。我接受了,因为这是第一个答案。
    【解决方案2】:

    在 CSS 文件中的 html 样式下添加 min-height: 100%;,我试过了,效果很好。

    html, body {
    min-height: 100%;
    }
    

    【讨论】:

      【解决方案3】:

      html & body 标签应为 100% 高度并从正文中删除边距:

      html,
      body {
        height: 100%;
      }
      body {
        margin: 0;
      }
      

      【讨论】:

        猜你喜欢
        • 2013-07-18
        • 1970-01-01
        • 2016-02-26
        • 1970-01-01
        • 1970-01-01
        • 2017-05-15
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多