background-clip
设置元素的背景(图片或颜色)是否延申到边框,内边距盒子,内容盒子下面
-
blackground-clip:center box;只有内容区有
-
blackground-clip:boder box; 延申到boder(默认值)
-
blackground-clip:pandding box; 延申到pandding
blackground-color
背景颜色
blackground-image
为元素设置一个或多个背景 设置多个背景记得用逗号隔开
blackground-image:url('图片路径’) blackground-image:url('图片路径','图片路径‘)
blackground-position
用来设置图片的位置 设置方式:
通过 top bottom lerf right center几个表示方位的词来设置背景图片
必须同时使用两个方位词,如果只写一个另一个默认为center
blackground-repeat
-
blackground-repeat:repeat-x;延x轴平铺
-
blackground-repeat:repeat-y;延y轴平铺
-
blackground-repeat:repeat 延xy轴都平铺(默认值)
-
blackground-repeat:no-repeat 不平铺
blackground-size
设置背景图大小
第一个值表示宽度
第二个值表示高度
如果只写一个值,另一个值默认auto;
-
100% auto 宽度和容器一致,高度自适应。(图片不变形但不一定可以铺满)
-
auto 100% 高度和容器一致,宽度自适应。(图片不变形但不一定可以铺满)
-
100% 100%宽高和容器一致。(可以铺满,图片不变形)
-
cover (以当前最适应得缩放比例铺满容器,但图片不一定展示全)
background-attachment
图片是否跟着元素移动
background-attachment:scroll会跟着元素移动(默认值)
background-attachment: fixed会固定在图片中,不会跟着元素移动
复合在一起写
blackground:图片地址 平铺方式 位置信息 背景颜色
blackground-size:cover(一般单独写)