前两天做了一个登录页面，登录页面背景是一张图片。图片要铺满整个屏幕，当时再将整个图片铺满时，总是遇到各种问题：①.图片虽然铺满整个屏幕，但是图片变形了；②.图片没有变形，但是图片没有铺满整个屏幕。
background: url("bg.png") no-repeat;
height:100%;---> height:100vh;
width:100%;
overflow: hidden;
background-size:cover;//或者background-size:1
//样式讲解
background-size: cover;——把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中；
min-height: 100vh;——视窗的高度，“视区”所指为浏览器内部的可视区域大小，即window.innerWidth/ window.innerHeight大小。
00%;
以下有两种方法是在度娘找到，大家可以试试
①
body {
background-image: url(bg.jpg);
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-color: #464646;
}这里的背景颜色，图片，等可以使用简写
②文章来源：https://www.toymoban.com/news/detail-646908.html
margin:0px;
background: url(images/bg.png) no-repeat;
background-size:100% 100%;
background-attachment:fixed;
url(images/beijing.png)——图片路径的位置；文章来源地址https://www.toymoban.com/news/detail-646908.html
到了这里，关于css实现图片全屏铺满自适应的三种方法的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
