CSS 2.1 参考手册/background-position
来自Blueidea
< CSS 2.1 参考手册
anuiz(讨论 | 贡献)2008-05-12T10:40:58的版本 (新页面: ==定义== background-position属性指定了背景图片的位置. 如果仅给定了一个百分比或长度值的话, 该值会被应用到横向的位置, 而纵向的值会被自动...)
目录
- 1 定义
- 2 案例
- 3 特性
- 3.1 可能的值
- 3.1.1 百分比 百分比
- 3.1.2 百分比
- 3.1.3 长度 长度
- 3.1.4 长度
- 3.1.5 top left
- 3.1.6 left top
- 3.1.7 top
- 3.1.8 top center
- 3.1.9 center top
- 3.1.10 right top
- 3.1.11 top right
- 3.1.12 left
- 3.1.13 left center
- 3.1.14 center left
- 3.1.15 center
- 3.1.16 center center
- 3.1.17 right
- 3.1.18 right center
- 3.1.19 center right
- 3.1.20 bottom left
- 3.1.21 left bottom
- 3.1.22 bottom
- 3.1.23 bottom center
- 3.1.24 center bottom
- 3.1.25 bottom right
- 3.1.26 right bottom
- 3.1.27 inherit
- 3.2 默认值
- 3.3 适用于
- 3.4 继承
- 3.1 可能的值
- 4 另见
定义
background-position属性指定了背景图片的位置. 如果仅给定了一个百分比或长度值的话, 该值会被应用到横向的位置, 而纵向的值会被自动设置为50%. 如果给定了两个值,则第一个值为横向位置. background-position属性的值可以为关键字、长度值或百分比以及他们的组合, (例如, 50% 2cm 或 center 2cm 或 center 10%). 出于逻辑,当使用关键字和非关键字的组合时,left和right只能用于第一个值,而top或bottom只能用于第二个值。
案例
a.external { padding-right: 16px; background-image: url('images/arrow.gif'); background-repeat: no-repeat; background-position: right; }
特性
可能的值
百分比 百分比
百分比
长度 长度
第一个值为横向位置,第二个值为纵向位置。以元素边框以内的左上角为基准。
长度
背景图片的横向位置,纵向位置自动被设为50%.
top left
相当于 0% 0%.
left top
相当于 0% 0%.
top
相当于 50% 0%.
top center
相当于 50% 0%.
center top
相当于 50% 0%.
right top
相当于 100% 0%.
top right
相当于 100% 0%.
left
相当于 0% 50%.
left center
相当于 0% 50%.
center left
相当于 0% 50%.
center
相当于 50% 50%.
center center
相当于 50% 50%.
right
相当于 100% 50%.
right center
相当于 100% 50%.
center right
相当于 100% 50%.
bottom left
相当于 0% 100%.
left bottom
相当于 0% 100%.
bottom
相当于 50% 100%.
bottom center
相当于 50% 100%.
center bottom
相当于 50% 100%.
bottom right
相当于 100% 100%.
right bottom
相当于 100% 100%.
inherit
使用父对象的计算值。
默认值
0% 0%
适用于
所有元素。
继承
没有。