第一种:
把图片放进父元素bacground里,也就是不用子元素:
.css{
// 在vue的:style里做更新一定要这么写 /cover
background: url('../../bg.jpg') no-repeat center center/cover fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
第二种:
把图片放在子元素的img里,父元素控制(多用于轮播之类的)
.css{
display: flex;
justify-content: center;
align-items: center;
}
.css img{
width: 100%;
}
注意:vue项目做dom动态更新的时候background-size若要进行动态变更,要集成写在background里,这样才能正常跟随数据刷新