美文网首页
vue背景图片用样式绑定的方式

vue背景图片用样式绑定的方式

作者: AI时代岁月笔记 | 来源:发表于2021-03-27 10:21 被阅读0次

    vue中为div设置背景图片,直接在css中这样写:

    background-image: url("/assets/images/web-cover.png");

    背景显示不出来,后来改为样式绑定的方式可以显示出来,如下:

    方式一:对象语法

    imgs: {

            bg: require("@/assets/image/web-cover.png"),

          },

     <div class="landing-wrapper" :style="{backgroundImage:`url(${imgs.bg})`}">

    方法二:绑定样式对象

      bgstyle:{

            backgroundImage: `url(${require("@/assets/image/web-cover.png")})` 

          }

     <div class="landing-wrapper" :style="bgstyle">

    相关文章

      网友评论

          本文标题:vue背景图片用样式绑定的方式

          本文链接:https://www.haomeiwen.com/subject/shiehltx.html