css背景图教学

背景图是网页中常用的元素之一，通过设置背景图，能够让网页更加美观，同时也能够给用户带来更好的体验。

在CSS中设置背景图使用的是background-image属性，具体方法如下：

body {
  
  background-image: url("图片路径");
}
 

需要注意的是，在使用背景图的时候，可以在CSS中设置多个属性，来实现更好的效果。例如，可以以固定位置、重复或是添加滤镜等方式使用背景图。

1. 设置固定位置

body {
  
  background-image: url("图片路径");
  
  background-position: center;
  
  background-repeat: no-repeat;
}
 

2. 背景图反复

body {
  
  background-image: url("图片路径");
  
  background-position: top left;
  
  background-repeat: repeat;
}
 

3. 添加滤镜

body {
  
  background-image: url("图片路径");
  
  -webkit-filter: brightness(150%);
  
  filter: brightness(150%);
}
 

总之，在设置CSS背景图时，更多的是需要自己不断地尝试，来寻找出最合适的效果。