vue 背景图引入

<template>
  <div>
    
    
    <img src="~@/da.jpg" width="100">
    
    <div class="img1">div>
    
    <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>

你可能感兴趣的:(前端)