vue实现背景自动全屏

1. 使用CSS

实现全屏背景图片最基本的方法是使用CSS。可以使用CSS的background-size属性将图片拉伸到整个屏幕大小。

body {

  background-image: url("******.jpg");

  background-size: cover;

}

使用cover属性可以使背景图像自适应屏幕大小，并且保持图片长宽比例。

注：如果有其他的内容需要在body元素中展示，那么这个方法就无法满足我们的需求，因为这样会将body元素的大小固定，并且在内容增多时出现滚动条，此时背景图片会有一定的缩放比例，不利于用户体验。