[TOC]
# 静态资源图片
## 方案一
`<img class="card" src="~@/assets/img/card_bg.png" ></img>`
## 方案二
`<div class="card"></div>`
~~~
<style>
.card {
background: url('~@/assets/img/card_bg.png') center center no-repeat;
}
</style>
~~~
##方案三
~~~
<script>
import cardPath from "@/assets/img/card_bg.png"
export default {
data() {
return {
cardPath: cardPath ,
}
}
}
</script>
~~~
~~~
<div class="card" :style="{backgroundImage: 'url(' + cardPath + ')' }"></div>
~~~
