1

在这里查看背景:

http://www.achingsoul.co.uk/gallery/

它应用于 body 元素并正确调整大小。但是当你在这里看到它时:

http://www.achingsoul.co.uk/services/

它被拉长,看起来很奇怪。根据检查员的说法,我不确定它是什么,因为它在两个页面上都是相同的:

body {
    background-image: url('images/aching-soul-background-2.jpg');
    color: #4a2f1f;
    background-size: cover;
}

不知道我做错了什么?

4

2 回答 2

1

删除background-size: cover; 您的背景将不再拉伸,而是垂直重复。两个页面之间的差异是由于服务页面的高度较大,当您使用 background-size 属性的封面值时,会导致这种效果。

于 2013-05-14T20:28:41.400 回答
0

尝试background-position:50% 50%;

并且

`/* FOR A LARGE-SINGLE IMAGE TO STRETCH COMFORTABLY ACROSS A BODY*/
    -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
    zoom:1;`
于 2013-05-14T20:32:10.103 回答