所属分类：web前端开发
在css中，可以使用“background-size”设置banner图自适应，语法“background-size:cover”；其中cover是指把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。
前端（vue）入门到精通课程：进入学习
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API调试工具：点击使用
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。
微博登录
QQ登录//test.css
.index-banner-top {
width: 100%;
background: url(../imgs/guanyu.png) no-repeat center center;
height: 210px;
background-size:cover
}
@media only screen and (max-width: 640px){
.index-banner-top {
height: 100px;
}
}登录后复制//test.html
<p class="index-banner-top"></p>
登录后复制电脑端显示：
手机端显示：
以上就是css如何设置banner图自适应的详细内容，更多请关注zzsucai.com其它相关文章！
