CSS进阶学习笔记（3）

一、背景

1.背景颜色

属性名：background-color（bgc）

2.背景图片

属性名：background-image(bgi)

属性值：bacrground-image:url('图片的路径')

注意点：

• url中可以省略括号
• 图片默认水平方向和垂直方向平铺
• 背景图片仅给盒子起到装饰效果，类似背景颜色，不能撑开盒子

3.背景平铺

属性名：background-repeat(bgr)

属性值：

取值	效果
repeat	（默认值）水平和垂直方向都平铺
no-repeat	不平铺
repeat.x	沿着水平方向（x轴）平铺
repeat.y	沿着水平方向（y轴）平铺

4.背景位置

 5.背景相关属性连写

书写：background：color image repeat position

可按照需求省略，若盒子大小与图片大小一样，可以直接写background：url（）

6.img与背景图的区别

1. img标签是一个标签，不设置宽高默认会以原尺寸显示
2. 背景图片需要使用div标签，则需要设置div的宽高，而背景图片是装饰的css样式，不能撑开div标签