vue 背景图引入

本文主要是介绍vue 背景图引入，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

<template><div><!-- 成功引入的三种方法： --><!-- 1 --><img src="~@/da.jpg" width="100"><!-- 2 --><div class="img1"></div><!-- 3 --><div class="img2" :style="{backgroundImage: 'url(' + img + ')' }"></div></div>
</template><script>
import Img from '@/da.jpg'export default {data () {return {img: Img,}}
}
</script><style>.img1{width: 100px;height: 100px;background: url('~@/da.jpg') center center no-repeat;background-size: 100px auto;}.img2{width: 100px;height: 100px;background-position: center center;background-repeat:  no-repeat;background-size: 100px auto;}
</style>

这篇关于vue 背景图引入的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---