Vue中引用背景图片的方法：1、通过img标签直接引用图片做背景；2、通过“background: url”的方式对元素添加样式引用背景图片；3、通过import方法，再引用背景图片即可。
Vue中引用背景图片的示例：
第一种方法
通过img标签直接引用图片做背景。
<imgclass="card"src="~@/assets/img/card_bg.png"></img>
第二种方法
通过“background: url”的方式对元素添加样式引用背景图片。
<divclass="card"></div>
<style>
.card{
background:url('~@/assets/img/card_bg.png')centercenterno-repeat;
}
</style>
第三种方法
通过import方法，再引用背景图片。
<script>
importcardPathfrom"@/assets/img/card_bg.png"
exportdefault{
data(){
return{
cardPath:cardPath,
}
}
}
</script>
<divclass="card":style="{backgroundImage:'url('+cardPath+')'}"></div>
如果您对该产品感兴趣，请填写办理（客服微信：xiaoxiongyidong）
发表评论
◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。