前端学习——基础篇
四、CSS学习
4.6、背景
作用在内容、内填充、边框
4.6.1、背景颜色 background-color属性
默认背景颜色透明色transparent
属性值可以是：关键词、十六进制色值、rgb颜色模式、rgba颜色模式
4.6.2、背景图片 background-image属性
语法：
background-image: url(图片地址);
background-image: none; 没有背景图片，默认值
特性：
- 背景图片不占位
- 默认在水平方向和垂直方向重复、平铺，铺满整个盒子
- 背景图是网页的装饰，起美化作用
- 写在样式中(不会被搜索引擎搜索到)
4.6.3、背景图是否重复 background-repeat属性
- background-repeat: repeat; 默认值 背景图在水平方向和垂直方向重复
- background-repeat: no-repeat; 不重复
- background-repeat: repeat-x; 沿着水平方向重复
- background-repeat: repeat-y; 沿着垂直方向重复
4.6.4、背景图定位属性 background-position属性
语法：
background-position: x y;
属性值：
- 关键词：left|center|right top|center|bottom 如果有1个关键词，另一个关键词默认为center
- 数值：px|% 如果是两个值，第一个表示水平方向，第二个表示垂直方向;如果只有一个值，表示水平方向，垂直方向居中（50%）
4.6.5、背景简写属性 background属性
background: background-color background-image background-repeat background-position;
/*引用一张背景图*/
background: #fff url(images/3_04.jpg) 27px 73px no-repeat;
/*引用多张背景图直接用逗号隔开即可*/
background: url(images/2_07.jpg) 15px 99px no-repeat , url(images/2_08.jpg) 373px 99px no-repeat,url(images/2_09.jpg) 731px 99px no-repeat;