CSS中的background-position属性用于设置背景图像的位置。

background-position 属性的基本语法

background-position: X轴位置 Y轴位置;

• X轴位置 和 Y轴位置 Neng是具体的像素值、百分比或者关键词。
• Ru果只指定一个值，则另一个值默觉得50%。

常用单位

• 像素值指定背景图像相对于元素边界的具体位置。
  • 比方说：background-position: 100px 200px; 表示背景图像距离元素左边100像素，顶部200像素。
• 百分比指定背景图像相对于容器的位置。
  • 比方说：background-position: 50% 50%; 表示背景图像在容器的中心位置。
• 关键词用 left centerrighttopbottom 等关键词。
  • 比方说：background-position: right bottom; 表示背景图像在容器的右下角。

许多背景图像

当为元素指定优良几个背景图像时 Neng用逗号分隔优良几个 background-image 声明，并且Neng为个个图像设置独立的 background-position。 - 比方说： css .example5 { background-image: url, url; background-repeat: no-repeat; background-position: 20px 40px, 50px 80px; } 这将第一个图像放置在20像素左边， 40像素顶部，第二个图像放置在50像素左边，80像素顶部。

默认值

• Ru果不设置 background-position， 则默觉得水平居中，垂直顶部对齐。
• Ru果只设置一个值，另一个值默觉得50%。

代码示例

css .example1 { background-image: url; background-position: right bottom; }

.example4 { background-image: url; background-repeat: repeat; background-position: 10px 20px; }

通过合理用 background-position 属性，Neng创建出丰有钱许多彩的网页背景效果。