vue项目设置背景图片

首先在div上面设置以下参数

<template>
<div  class="bg" :style ="bg">
</div>
</template>

然后再script里面设置如下参数

<script>
export default {name: 'fash',data() {return {bg: {backgroundImage: "url(" + require("./img/fash.png") + ")",backgroundRepeat: "no-repeat",backgroundSize: "100% 100%",},};},methods: {},mounted() {}
};
</script>

有一个要注意的是：这个图片的位置很奇怪，我放在其他目录下面不行，只有发在与vue同目录下才行

vue项目设置背景图片相关推荐

在vue中设置背景图片
在vue中设置背景图片在App.vue中将样式中默认的margin-top 改为0,使得页面顶部不留白 #app {font-family: 'Avenir', Helvetica, Arial, ...
vue中设置背景图片的方式
vue中设置背景图片直接设置背景图片动态设置背景图片直接设置背景图片 1.在data中声明背景图片相关配置 export default {data () {return {// 顶部导航背景图 ...
Vue之设置背景图片
放置背景图片路径: 设置背景图片 <template><div class="background"><img :src="imgSrc&q ...
vue :style 设置背景图片 backgroundImage
vue 日常坑 vue :style 设置动态设背景图片 backgroundImage 控制台会报错 404错误,但是不影响页面使用如下: http://localhost:8080/ooooo/ ...
vue 动态设置背景图片，和背景渐变
设置背景图和大小,bgimg是图片链接 <div :style="{backgroundImage: 'url(' + bgimg + ')', backgroundSize:'con ...
vue项目中背景图片写成行内样式不显示
今天写代码的时候发现把背景图片写在行内样式中没法显示 <div class="template-card" style="background-image:url( ...
vue使用设置背景图片的方式实现淡入淡出轮播图2
首先放一份,我调试完美运行的代码: <!DOCTYPE html> <html><head><meta charset="utf-8"&g ...
vue 动态设置背景图片
backgroundImage需要做判断 <div class="right-con" :style="{backgroundImage: 'url(' + (co ...
Vue中设置背景图片和透明度
如果文章对你有帮助欢迎[关注❤️❤️❤️点赞

vue项目设置背景图片

vue项目设置背景图片相关推荐

最新文章

热门文章