前面简单的学习了文本样式,字体样式,以及一些css选择器等,这篇主要来学习一下css的背景属性。
1. css背景复合写法
css背景属性可以设置背景颜色,背景图片,背景平铺,背景图片滚动,背景图片位置等。
background: background-color | background-image | background-repeat | background-attachment | background-position;
background: red url(image/img.png) no-repeat fixed top;
上述代码是背景属性的复合写法,当使用这种简写属性时,没有顺序要求,但是一般习惯性写成上述顺序。
2. 背景半透明
background: rgba(0,0,0,0.3)
背景半透明采用rgba实现,最后一个参数表示透明度,取值范围为0-1
属性 | 作用 | 值 |
background-color | 背景颜色 | 预定义颜色值/十六进制/RGB |
background-image | 背景图片 | url(背景图片路径) |
background-repeat | 背景图片是否平铺 | repeat、no-repeat、repeat-x、repeat-y |
background-position | 背景位置 | length/position分别是x和y坐标 |
background-attachment | 背景附着 | scroll(背景滚动)/fixed(背景固定) |
背景缩写 | 书写更简单 | |
背景半透明 | 背景颜色半透明 | rgba(0,0,0,0.3) |