vue的style方式绑定行内样式-background-image的方式等

一：

<template>
  <div id="app">
    <div class="y_bj" :style="y_bj"></div>
  </div>
</template>
<script>
import { Toast } from "vant";
export default {
  data() {
    return {
      y_bj: {
        backgroundImage: "url(" + require("@/assets/images/user_bj.png") + ")",
        backgroundRepeat: "no-repeat",
        backgroundSize: "100%",
        width: "100%",   
      }
    };
  },
  methods: {}
};
</script>
<style lang="scss" scoped>
.y_bj {
  width: 375px;
  height: 125px;
}
</style>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
  
26
  
27
 

二：

v-bind:style="{backgroundImage:'url(' + item.videopic + ')', backgroundRepeat:'no-repeat', backgroundPosition:'center center', backgroundSize: 'contain'}"

:style="{height: showList && carList.length > 0 ? '23rem' : '0'}"


  

 

  
1
  
2
  
3
  
4
 

文章来源: lvsige.blog.csdn.net，作者：祥子的小迷妹，版权归原作者所有，如需转载，请联系作者。

原文链接：lvsige.blog.csdn.net/article/details/115461512