background属性是所有背景属性的缩写: 以下是这些背景属性: background-color:背景颜色 你可以通过颜色名称(red/green/blue)来设置 也可以用十六进制(#fff/#000/#bcbcbc) 还可以用到rgb(x,x,x) ...
background属性是所有背景属性的缩写:
以下是这些背景属性:
background-color:背景颜色
你可以通过颜色名称(red/green/blue)来设置
也可以用十六进制(#fff/#000/#bcbcbc)
还可以用到rgb(x,x,x) x取值(0~255)
background-position:背景开始位置
也是三种取值方式,第一种是用方位词(top/right/bottom/left)组合,如left top
百分比x% x%,如0% 0%表示左上角
用像素表示,如100px 100px
background-size:背景大小
你可以通过设置给定长度来调节背景大小,如background-size:100px 80px;
也可用百分比来设置,注意这里的百分比说的是背景定位区域,而不是图像的原本大小。如background-size:50% 50%;
background-repeat:背景重复设置
no-repeat:不重复
repeat-x: x(水平)方向上重复
repeat-y: y(垂直)方向上重复
repeat:重复
background-origin:指定background-position属性的相对位置
padding-box:背景填充框的相对位置
border-box:背景边框的相对位置
content-box:背景相对内容框的位置
<!doctype html><html><head><style>div{ width:100px; height:100px; border:1px solid black; padding:20px; margin:20px; background-image:url("weixin.png"); background-repeat:no-repeat; background-position:top; float:left;}#id1{ background-origin:padding-box;}#id2{ background-origin:content-box;}#id3{ background-origin:border-box;}</style></head><body><div id="id1">background-origin:指定background-position属性的相对位置</div><div id="id2">background-origin:指定background-position属性的相对位置</div><div id="id3">background-origin:指定background-position属性的相对位置</div></body></html>
原标题:CSS背景属性background
关键词:CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。