Question

CSS中背景图怎么居中显示啊

限定宽度990px,.居中显示背景图。怎么修改下面的代码，请好心人帮忙

locationBar{background: url(../images/yzj_location-bg.png) repeat-x;}
我改成了

.locationBar{background: url(../images/yzj_location-bg.png) no-repeat center center;width:990px}
宽度变成990px，但是靠左显示的。

Answer 1

css中有一个background-position 属性设置背景图像的起始位置。

他有以下可能的值：

1，top left  左上角  

2，top center  正上方

3，top right  右上方

4，center left  正左方

5，center center  正中

6，center right   正右方

7，bottom left  左下方

8，bottom center  正下方

9，bottom right   右下方

所以要是背景图居中显示，css里边加上下边这条属性：

background-position:center center;

Answer 2

background:url(../images/index_x.jpg) repeat-x center -100px;
repeat-x 你横向平铺还 居中显示 脑袋啊？？？平铺就不能 实现居中了，你改改 div的 宽度，然后 你再试试 集中平铺和 左对齐平铺 和 右对齐平铺，估计区别不是很大，再不行 你就把图改改宽度。。

追问

locationBar{background: url(../images/yzj_location-bg.png) no-repeat center center;width:990px}
宽度变成990px，但是靠左显示的。

Answer 3

locationBar{background: url(../images/yzj_location-bg.png) no-repeat center center;}
no-repeat是不循环显示repeat-x是在横向循环

追问

.locationBar{background: url(../images/yzj_location-bg.png) no-repeat center center;width:990px}
我改成了这样，只变了宽度，但没有居中显示。是靠左显示的。

追答

background-position: center center;
在单独指定position的位置试一下，放在background属性的下边

追问

只要加width:990px就居左显示990px.
把background-position:center center 放在background后面也不行。
单独添加.locationBar{background-position:center center;}也不行