1、background-position:0 0; 背景图片的左上角将与容器元素的左上角对齐。该设置与background-position:left top;或者background-position:0% 0%;设置的效果是一致的。例如: .container{ width:300px; height:150px; background:transparent url(bg.jpg) no-repeat scroll 0 0; border:5px solid green; }...
以下是几个实际的例子来演示background-position的用法: 1.指定背景图片居中对齐 background-position: center; 2.指定背景图片距离左边界10像素,垂直方向上居中对齐 background-position: 10px center; 3.指定背景图片距离右边界20像素,垂直方向上距离底部30像素 background-position: right 20px bottom 30px; 4.使...
background-position的用法 background-position是CSS中控制背景图像位置的一个属性。使用background-position可以改变背景图片在元素中的定位位置。这个属性需要设置两个值,以水平和垂直方向的像素数值来控制图像位置。在实际开发中,background-position可以根据设计要求,对背景图像进行细微的调整,使其在视觉效果上更加优美。
3、这个坐标的y轴箭头朝下,也就是右下方(容器内部)x y的值才都为正。 4、x y值分别表示背景图片的左顶点相对于坐标原点(也就是容器的左顶点)的值。 5、x y的值可以用百分比或者px来表示。 6、x y也可以用“left、right、top、bottom、center”这五个对齐方式来表示, 但注意:用“left、right、top、bot...
background-position:后面有两个属性,第一个是水平位置,第二个是垂直方向的位置,这里需注意的是两个属性的顺序比如说 background-position:left -29px;(当中的left指从图片的最左端读起,-29px就是将图片向上移动29px,然后开始读)再如:background-position:15px 20px;(指将图片向右移15px,向下移20px;)简单...
background-position属性在雪碧图中的用法 使用雪碧图之前,我们需要知道雪碧图中各个图标的位置。 从上面的图片可以看出雪碧图中各个小图标(icon)在整张雪碧图的起始位置,例如第一个图标(裙子)在雪碧图的起始位置为 x:0,y:0,第二个图标(鞋子)在雪碧图的起始位置为 x:0,y:50px,第三个图标(足球)在雪碧图的...
下面使用 foreground-position属性简单演示一下( background-position的用法是一样的 ）import win.ui;/*...
background-positon:长度单位/关键字;语法中的取值包括两种，一种是采用长度单位，另一种是关键字描述。长度单位指的是px、百分比等。 当background-position取值为关键字时，也需要设置水平方向和垂直方向的值，只不过值不是使用px为单位的数值，而是使用关键字代替。 属性值说明top left左上top center...
语法:background-position : length || length background-position : position || position 取值:length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅 长度单位 position : top | center | bottom | left | center | right 说明:设置或检索对象的背景图像位置。必须先指定 background-image 属性...
定义和用法 CSS background-position属性设置背景图像的起始位置。 这个属性设置背景原图像(由CSS background-image定义)的位置,背景图像如果要重复,将从这一点开始。 提示:您需要把CSS background-attachment属性设置为"fixed",才能保证该属性在Firefox和Opera中正常工作。