html - 如何缩放背景图像以适应响应式 div

Question

我正在尝试做一个“你知道吗？”固定div在右上角。不幸的是，经过 3 小时的测试，许多解决方案仍然找不到正确的解决方案。正如你在这个 fiddle 上看到的: http://jsfiddle.net/dq8f3d4p/我无法使背景适合 div。

两者:background-size: cover; 和 background-size: 100%; 似乎无法正常工作。

Answer 1

在您的代码中，您正在使用速记 background 属性覆盖 background-size :

.dyk{
    position: fixed;
    z-index:2;
    width: 17.26%;
    height: 11%;
    left: 80%;
    top: 80%;
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-image: url(http://i.imgur.com/gxp9iDV.png);
}

将其更改为 background-image 属性将导致图像拉伸(stretch)到 100% 大小。