CSS background-image resizes when I set background-attachment: fixed

北城余情 提交于 2019-12-11 06:25:34

问题


I have a div named "page". I set its background-image with CSS, using the code below. I size the image to take 100% of the div's width, and it sets nicely its height to keep its scale. But when I set "background-attachment: fixed", it resizes the image. It increases the image size, and now it doesn't fit into my div, so most of it is cut. I will highly appreciate any help.

The CSS code:

    #page {
        height: 100%;
        width: 60%;
        margin: 0 auto;
        background-image: url('bg2.jpg');
        -webkit-background-size: 100% auto;
        -moz-background-size: 100% auto;
        -o-background-size: 100% auto;
        background-size: 100% auto;
        background-repeat: no-repeat;
        background-attachment: fixed;
    }

回答1:


I have just encountered the same issue with a background image sized using background-size: contain;.

When I set the background-attachment to fixed, the sizing no longer applies to the element carrying the background image, but instead it seems to apply to the viewport, so it's much larger and extends beyond the original element.



来源:https://stackoverflow.com/questions/13039135/css-background-image-resizes-when-i-set-background-attachment-fixed

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!