如何更改Vue Slick Carousel中箭头的样式颜色?

时间:2020-09-23 10:43:06

标签: vue.js sass nuxt.js carousel slick.js

我在项目中使用vue-slick-carousel作为轮播。 我想更改箭头的颜色而不更改此程序包模块中的样式。 我在主CSS文件中添加了此代码,但对我来说不起作用

        .slick-prev:before,
            .slick-next:before {
                font-size: 20px;
                line-height: 1;

                opacity: 0.75;
                color: red !important;

                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }
        }

1 个答案:

答案 0 :(得分:3)

有趣的是,我前一阵子也遇到过同样的问题,我的问题是我在一个有范围的样式标签中定义了我的样式。

在全局样式标签中尝试以下代码:

button.slick-prev:before, button.slick-next:before {
      background-color: red !important;
}