本篇文章给大家分享的是css3中background-position的用法,有需要的朋友可以参考一下。
在css3之前设置background-position,你可以从元素的左上角设置位置。
例如:
1 |
|
问题是无法从另一个点确定确切的位置,例如从底部/右边,我们只能从左上角开始。
我们可以写:background-position:right bottom;也可以写:background position:70%/从left开始/ 80%/从top开始/;,
但是我们不能从右边写20px而从底部写20px。
我们来看看新的background-position属性
为了解决这个问题,CSS3为我们提供了确定从何处开始定位以及确定0,0点的选项。
我们怎么实现呢?
我们现在可以用css3写下水平和垂直位置的开头,如右下角+起点的值,而不是只写2个值(左上角的水平和垂直点)。
让我们创建一个例子:
首先创建一个带有一些样式的空div:
HTML:
1 2 |