background-position:背景颜色:background-color
background-color:red;
值可以为颜色的英文单词,也可以是#000000这样的色位,也可以是R:255 G:255 B255这样的表达方式
----------------------------------分割线------------------------------------------------------------
在背景里放张图片:background-image:
background-image:url(图片地址);
但是会平铺整个块,通常会加上repeat去控制
- - - - - - - - - - - - - 小分割线- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
背景图片的平铺控制:background-repeat
background-repeat:值
值为:no-repeat 不平铺
repeat-x 在x轴(横向)平铺
repeat-y 在y轴(纵向)平铺
- - - - - - - - - - - - - 小分割线- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
----------------------------------分割线------------------------------------------------------------
背景图片的位置控制:background-position:
background-position:center center;--------------------(固定在页面某个位置,要输入两个值)
center----中间
left--------左边
right------右边
top--------顶部
bottom---底部
也可以写百分比,如:background-position:20% 23%;
----------------------------------分割线------------------------------------------------------------
背景尺寸:background-size
background-size: 100% 100%;(背景尺寸,属于css3属性,IE9以下不支持该属性)
contain------里面的图形等比例外接外面的块,不会变形
cover----铺满整一个块
----------------------------------分割线------------------------------------------------------------
简写方式:background:blue url(img/1.png) 等等值