css背景自适应大小

在网页设计中，往往需要使用背景图片作为网页的背景，但是不同的设备有不同的屏幕分辨率，因此需要让背景图片自适应大小以适应不同的设备。

body {
  background: url(bg.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
 

上述代码使用了CSS3的background-size属性，可以让背景图片自适应大小以适应不同的设备。其中cover值表示以覆盖整个容器为目标，等比例缩放背景图像的大小，使得背景图像完全覆盖容器，可能有部分图像不显示，但比例一定。

与cover相对应的是contain，表示以保持图像完整为目标，等比例缩放背景图像的大小，使背景图像的宽度和高度都不大于容器的宽度和高度，可能有留白。

通过使用background-size属性，让背景图片自适应大小，能够让网页在不同设备上具有良好的显示效果，提高用户的体验感。