1.背景
1) background-color 背景颜色,可以使用的背景颜色方式有英文单词,如red,blue等;其次十六进制数,如#eee,#7c7c7c等;RGB颜色.
background-color:red;
background-color:#ccc;
background-color:rgb(0,0,0); //数值在0-255之间,可随便变换
background-color:rgba(0,0,0,0.5); //最后一个为0-1之间的数,表示透明度
2) background-image: 背景图片 语法如下:
background-image:url() ;
3) background-repeat:背景图片是否平铺,属性值有 repeat-x 水平平铺 , repeat-y 垂直平铺 no-repeat 不平铺
4) background-position 位置 ,属性值有水平方向: left center right 垂直方向 : top center bottom ,也可以是数值 x y
background-position:left center;
background-position:0 0;
5) background-attachement:scroll; scroll是默认值,表示背景跟随着网页的浏览滚动, fixed 表示 固定的, 背景在浏览时不滚动,
PS:背景的简写方式不加限制,上述的五个方面的属性可以用任意顺序和个数书写,语法如下:
background: red 0 0 scroll;
额外属性:
背景缩放: background-size: 有两个属性值,只改变一个值的话,就按比例的缩放,可以使用百分比, 如:
background-size:90px 120px;或 background-size:80px(50%);
特殊属性值:cover 背景铺满整个盒子,满足高度和宽度后,溢出的部分被隐藏(可能会有部分超出)
contain 自动调整缩放的比例,保证图片整个在盒子里面,宽度和高度有一个到达盒子边界,图片不再缩放
加多张图片: background:url() ......... , url( ) ........ , ;有多个的话用逗号分开,如果有交集,上面的会覆盖下面的,所以如果需要背景色,则放在最后一个添加.
2.CSS选择器的优先级
CSS选择器通过四个字符串来表示选择器的权重高低,如下:
标签选择器:0,0,0,1
类选择器:0,0,1,0
ID选择器:0,1,0,0
行内样式:1,0,0,0
!important的贡献值为无穷大
CSS进行样式判定时,对同一标签进行样式改变,哪个权重大用哪个,权重可以累加, 如 div p 的权重为0,0,0,2
PS:1) 没有进位的说法,不会有加起来进位,级别之间不可超越 0,0,0,100 < 0,0,1,0
2) 继承的权重为0,0,0,0
3) 通用选择器的权重最低
4) 有!important权重最大