首页 > 解决方案 > 用于自定义图像背景的 NProgress CSS

问题描述

嗨,我在我的 Vue3 项目中为一家面包店实现了 NProgress,我想使用我拥有的各种烘焙食品的自定义精灵图像来自定义它的背景。我遇到的问题是图像出现了,但我仍然在图像周围发出蓝光。有谁知道如何摆脱它?我尝试了 box-shadow 没有成功

这是它的样子

这是我的 sass 代码

    height: 1rem
    background: $nav_background_image
    border: none
    box-shadow: none

我不确定这种蓝色色调是否会在执行*nprogress-busy*课程时添加任何帮助将不胜感激

标签: cssvue.jssassresponsive-designvue-nprogress

解决方案


这对我有用

#nprogress .bar {
  background: red;
}
#nprogress .peg {
  box-shadow: 0 0 10px #FFBB00, 0 0 5px #FFBB00;
}

推荐阅读