美文网首页
vue引入图片和背景图

vue引入图片和背景图

作者: 落花夕拾 | 来源:发表于2019-12-12 11:41 被阅读0次

1、data(){}中引入图片

              src:require('@/assets/1.jpg'),//可以显示图片
              src:require('../../assets/1.jpg'),//可以显示图片
              src:'../../assets/1.jpg',//不可以显示图片

2、html中引入图片

 <img :src="src" alt="">       <!--动态展示图片-->
 <img src="@/assets/1.jpg" alt="">       <!--可以显示图片-->
 <img src="../../assets/abc.jpg" alt=""> <!--可以显示图片-->
 <img src="require('@/assets/2.jpg')" alt=""> <!--不可以显示图片-->

3、style 中引入图片

     background-image: url(/static/img/bg.f334645.jpg);
    background-repeat: no-repeat;
    background-size: cover;//background-size: auto 100%;

相关文章

网友评论

      本文标题:vue引入图片和背景图

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