cssposition属性取值(css中position属性值有哪些)
大家好，感谢邀请，今天来为大家分享一下cssposition属性取值的问题，以及和css中position属性值有哪些的一些困惑，大家要是还不太明白的话，也没有关系，因为接下来将为大家分享，希望可以帮助到大家，解决大家的问题，下面就开始吧！
CSS background-position的用法
是用来定位图片的位置的，最主要使用在一张png上有多个logo或者 ico这个时候就用到background-position了。
background-position：x y x等于平行轴 y等于竖行轴，x y的取值可以为正数，也可以是负数。
background-position: left-29px;是背景位移，background-position后面有两个属性，第一个是水平位置，第二个是垂直方向的位置，这里需注意的是两个属性的顺序
比如：
background-position: left-29px;(当中的left指从图片的最左端读起，-29px就是将图片向上移动29px,然后开始读)
扩展资料：语法
background-position: length|| length
background-position: position|| position
取值
length:百分数|由浮点数字和单位标识符组成的长度值。
position: top| center| bottom| left| center| right
注：设置或检索对象的背景图像位置，必须先指定 background-image属性，该属性定位不受对象的补丁属性( padding)设置影响。
默认值为： 0% 0%。此时背景图片将被定位于对象不包括补丁( padding)的内容区域的左上角，如果只指定了一个值，该值将用于横坐标，纵坐标将默认为 50%，如果指定了两个值，第二个值将用于纵坐标。
如果设置值为 right center，因为 right作为横坐标值将会覆盖 center值，所以背景图片将被居右定位，对应的脚本特性为 backgroundPosition。
CSS background-position的定义和用法
background-position属性设置背景图像的起始位置。
这个属性设置背景原图像（由 background-image定义）的位置，背景图像如果要重复，将从这一点开始。
提示：您需要把 background-attachment属性设置为 fixed，才能保证该属性在 Firefox和 Opera中正常工作。默认值： 0% 0%继承性： no版本： CSS1 JavaScript语法： object.style.backgroundPosition=center如何定位背景图像：
body{ background-image:url('bgimage.gif');background-repeat:no-repeat;background-attachment:fixed;background-position:center;}
背景位置属性用于设置背景图像的位置，这个属性只能应用于块级元素和替换元素。其中替换元素包括img、input、textarea、select和object。 background-positon:长度单位/关键字;语法中的取值包括两种，一种是采用长度单位，另一种是关键字描述。长度单位指的是px、百分比等。当background-position取值为关键字时，也需要设置水平方向和垂直方向的值，只不过值不是使用px为单位的数值，而是使用关键字代替。属性值说明top left左上top center靠上居中top right右上left center靠左居中center center正中right center靠右居中bottom left左下bottom center靠下居中bottom right右下
css手册总结(二)
分拆纵向独立属性。为元素设置上、下外边距。
分拆横向独立属性。为元素设置上、下外边距。
分拆独立属性。为元素单独设置上、右、下、左4个方向的内边距。
属性值描述:
1.阴影类型：此参数可选，默认的投影方式是外阴影；如果取其唯一值“inset”,就是将外阴影变成内阴影。
2.X-offset:是指阴影水平偏移量,其值可正可负，正值，则阴影在对象的右边，负值，阴影在对象的左边
3.Y-offset:是指阴影的垂直偏移量，其值也可以是正负值，正值，阴影在对象的底部，负值时，阴影在对象的顶部。
4.阴影模糊半径：此参数是可选，只能为正值，如果其值为0时，表示阴影不具有模糊效果，值越大阴影的边缘就越模糊
5.阴影扩展半径：此参数可选，其值可为正负值，正值，则整个阴影都延展扩大，反之，则缩小
6.阴影颜色：此参数可选，不设定任何颜色时，浏览器会取默认色，但各浏览器默认色不一样，特别是在webkit内核下的safari和chrome浏览器将无色，也就是透明，建议不要省略此参数。
注：多层阴影，最内层优先级最高，之后依次降低。使用逗号“，”隔开。
3.border-image-width：定义元素边框图像的厚度。
该属性用于指定使用多厚的边框来承载被裁剪后的图像。
当该属性省略未定义时，因为默认值是 1，所以该属性的计算值会是 1* border-width，相当于会直接使用 border-width的定义。
4.border-image-outset：定义边框图像从边框边界向外偏移的距离。
5.border-image-repeat：定义分割图像怎样填充边框图像区域。
2.background-image:定义元素使用的背景图像。
3.background-repeat:定义元素的背景图像如何填充。
4.background-attachment：定义滚动时背景图像相对于谁固定。
5.background-position:指定背景图像在元素中出现的位置。
example:假设要定义背景图像在容器中右下方，并且距离右边和底部各有20px
要注意的是：设置3个或4个值，偏移量前必须有边界关键字。也就是说，形如：10px bottom 20px，这样的参数设置是错误的，因为10px前面没有关键字。
6.background-origin:指定的背景图像计算background-position时的参考原点(位置)。
取值：
border-box：从border区域（含border）开始显示背景图像。
padding-box：从padding区域（含padding）开始显示背景图像。（默认）
content-box：从content区域开始显示背景图像。
注意，如果设置background-origin后，设置background-position会相对于background-origin设置的位置做参考来偏移背景图，比如设置在border开始显示图片，这是设置background-position：left 10px top 10px是相对于边框进行左边偏移10px上面偏移10px，如果没设置background-origin，默认是相对于padding处进行偏移。
7.background-clip：指定对象的背景图像向外裁剪的区域。
取值：
border-box：从border区域（含border）开始向外裁剪背景。(默认)
padding-box：从padding区域（含padding）开始向外裁剪背景。
content-box：从content区域开始向外裁剪背景。
text：从前景内容的形状（比如文字）作为裁剪区域向外裁剪，如此即可实现使用背景作为填充色之类的遮罩效果。
8.background-size：定义背景图像的尺寸大小
如果你还想了解更多这方面的信息，记得收藏关注本站。