v-bind绑定样式表:
----------------------------------------------------------------------------------------------------
HTML写法:
<div class="myItem" style="text-align:center; background-image:url(''); background-size:auto 100% ;background-position:center; background-repeat:no-repeat;" >
v-bind绑定style写法(里面是个json):?
<div class="myItem" :index="index" ?:style="{'text-align':'center','background-image':'url('+item.photo+')','background-size':'auto 100%','background-position':'center','background-repeat':'no-repeat'}" ?>
<div class="box" :style="{width:width,height:height,backgroundColor:backgroundColor}"></div>
nuxtjs动态设置background-image:
? <div :style="{backgroundImage: `url(` + require(`~/assets/ProjectPictures/${this.background}`) + `)`}">
nuxt绑定内联样式 :style="{'title':'里面必须标准的json'}" ? 里面必须是标准的json格式否则出错
-------------------------------------------------------------------------- ?
?? ?<div style="float:left;width:27.18%;height:14.2vw; border:1px solid #ccc;background-size:100% 100%;"??:style="{'background-image':'url(\''+require('@/assets/images/index/advantage1.png')+'\')'}"??>
?? ??? ?<nuxt-link to="/freeCoupons" style="display: flex; margin:9vw 2vw auto auto; align-items:center; width: 20vw;border:0px solid #ccc;color:#999;font-size: 10pt;font-weight:bold; line-height:2;" >? test?? </nuxt-link>
?? ?</div> ?
(注意::style后面是个json,否则会报错!)????