css背景图片全屏铺满自适应
时间: 2023-06-10 16:08:58 浏览: 4613
css背景图片自适应.
可以使用CSS的background-size和background-position属性来实现背景图片全屏铺满自适应。
代码如下:
```
html, body {
height: 100%;
margin: 0;
padding: 0;
}
.background {
background-image: url('your-image-url');
background-size: cover;
background-position: center;
height: 100%;
}
```
解释:
1. 设置html和body的高度为100%,这样背景图片才能撑满整个页面。
2. 给背景元素(例如div)设置高度为100%,使其与页面高度保持一致。
3. 使用background-image属性设置背景图片的URL。
4. 使用background-size: cover属性,使背景图片可以自适应屏幕大小并充满整个背景区域。
5. 使用background-position: center属性,使背景图片在背景区域中居中对齐。
阅读全文