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; }...
img { position: absolute; left: 100%; } 一定是在父容器外部。但是,在<position>值中,却是不一样的表现。 我们可以看下这个iframe示意: 其中,上面的妹子是background-position百分比,下面的50%透明的妹子是left百分比,可以看出两者的定位差异。 这就是为何background-position:100% 100%是定位在容器右下角的...
inherit 指定background-repea属性设置应该从父元素继承 4.background-position背景定位 background-position属性设置背景图像的起始位置 xpos ypos第一个值是水平位置,第二个值是垂直。左上角是0。单位可以是长度px,关键字和百分数值 关键字成对出现left right top bottom center,如果仅指定一个关键字,其他值将会是...
background-position:center top;设置背景图片在当前容器中的位置。 background-attachment:scroll;设置背景图片是否跟着滚动条一起移动。 属性值可以是:scroll(与fixed属性相反,默认属性)、fixed(背景就会被固定住,不会被滚动条滚走)。 另外还有一个综合属性叫做background,它的作用是:将上面的多个属性写在一个声明中...
CSS background-position 属性实例 如何定位 background-image: body { background-image:url('smiley.gif'); background-repeat:no-repeat; background-attachment:fixed; background-position:center; } 尝试一下 » 标签定义及使用说明background-position 属性设置背景图像的起始位置。
background-position 属性可以用其它数值,关键词和百分比来指定,这比较有用,尤其是在元素尺寸不是用像素设置时。 关键词是不用解释的。x 轴上: * left* center* right y 轴上: * top* center* bottom 顺序方面和使用像素值时的顺序几乎一样,首先是 x 轴,其次是 y 轴,像这样: ...
CSS 中 background-position,让你的网页设计达到新的高度 背景位置(background-position)是 CSS 中一个非常重要的属性,它决定了背景图片的位置。它可以使用两个值来设置,分别表示背景图片的水平和垂直位置。背景位置的默认值是 0% 0%,表示背景图片位于元素的左上角。你可以使用关键字来设置背景位置,如 center...
background-position: bottom left; 1. 2. 设置背景位置为 水平居中 垂直居中 :粉色区域是盒子的区域 , 图片背景位于盒子中心位置 ; /* 设置背景位置 - 水平居中 垂直居中 */ background-position: center center; 1. 2. 设置背景位置 指定一个值 另一个默认居中 :粉色区域是盒子的区域 , 图片背景位于盒子...
最后的那个center其实就是background-position值,就是告诉浏览器我这个背景图片要定位在元素box的中间位置。 看起来确实很简单,没什么可讲的,但是你真的对它所有用法都了如指掌吗? 一、关键字(top、bottom、left、right、center) 1. 两个值 background-position可以取两个值,一个为横轴方向,一个为纵轴方向。