Web前端开发笔记18——背景

1.背景颜色：background-color属性，其值如果是transparent即为透明，也可以手动指定背景颜色为其它。

<style>
    div{
      width: 200px;
      height: 200px;
      background-color: darkgray;
    }
  </style>

2.背景图片：background-image属性，设置背景图片。

语法：background-image：none|url 

3.背景平铺：background-repeat属性，设置图片平铺。

页面元素既可以添加背景颜色也可以添加背景图片，只不过背景图片会压住背景颜色。

4.背景图片位置：background-position属性可以改变图片在背景中的位置。

语法：background-position：x y;

• 如果指定的两个值都是方位名词，则两个值的前后顺序无关。
• 如果只指定一个方位名词，另一个值省略，则第二个值默认居中对齐。

5.背景图像固定（背景附着）

6.背景复合写法：

有一个约定写法：

不一定要严格遵从。

7.背景色半透明：

语法：background： rgba（x,x,x,y）;

y就是透明度，取值在0~1之间。

实际开发中，我们可以将透明度"0.5"写作".5",快捷方便。