CSS background-position属性

定义和用法

background-position属性设置背景图像的起始位置。

提示：默认情况下，背景图像位于元素的左上角，并垂直和水平重复。

特征	说明
默认值	0% 0%
继承	没有
动画	有。CSS动画参考
CSS版本	CSS1
JavaScript语法	object.style.backgroundPosition="center"尝试一下

表中的数字指定了完全支持该属性的第一个浏览器版本。数字后跟-ms-， -webkit-，-moz-或-o-指定使用前缀的第一个版本。

属性	Internet Explorer	Chrome	FireFox	Safari	Opera
属性名称
background-position	4.0	1.0	1.0	1.0	3.5

注意： IE8及更早版本不支持在一个元素上使用多个背景图像。

background-position: value;

让背景图片从内容的左上角开始：

body { 
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center; 
}

尝试一下

属性值	描述
left top left center left bottom right top right center right bottom center top center center center bottom	如果您只指定一个关键字，则另一个值将是“center”
x% y%	第一个值是水平位置，第二个值是垂直位置。左上角是0％0％。右下角是100％100％。如果只指定一个值，则另一个值为50％。。默认值为：0％0％
xpos ypos	第一个值是水平位置，第二个值是垂直位置。左上角为0 0.单位可以是像素（0px 0px）或任何其他CSS单位。如果只指定一个值，则另一个值为50％。你可以混合％和位置
initial	将此属性设置为其默认值。查看initial关键字
inherit	从其父元素继承此属性。查看inherit关键字