【问题标题】:change dots size in slick.js更改 slick.js 中的点大小
【发布时间】:2016-05-07 10:32:21
【问题描述】:

我尝试在我的网站中实现带有点的 slick.js 滑块。 滑块点的大小非常小。我可以更改点的大小吗?或者它是默认的一个

我的 CSS

.slider {
          width: 650px;
          margin: 0 auto;
        }

        img {
          width: 200px;
          height: 200px;
        } 

我的html

<div class="row">
    <div class="col-sm-6">
        <div class="slider-about">
            <div class="slider">
                <div>
                    <img src="resources/image/slide1.jpg">
                </div>
                <div>
                    <img src="resources/image/slide2.jpg">
                </div>
                <div>
                    <img src="resources/image/slide3.jpg">
                </div>
                <div>
                    <img src="resources/image/slide1.jpg">
                </div>
                <div>
                    <img src="resources/image/slide2.jpg">
                </div>
                <div>
                    <img src="resources/image/slide3.jpg">
                </div>
            </div>
        </div>
    </div>
</div>

我的 js:

$('.slider').slick({
      slidesToShow: 3,
      slidesToScroll: 3,
      dots: true,
      infinite: true,
      cssEase: 'linear'
    });

这是出现的点

【问题讨论】:

    标签: jquery css slick.js


    【解决方案1】:

    默认主题样式表 slick-theme.css 使用“slick”字体系列作为图标。是否已将字体文件文件夹上传到您的项目? 或者如果您不想使用“slick”字体系列,您可以在 slick-theme.css 中的第 178 行调整以下 CSS 规则

        .slick-dots li button:before
        {
            font-family: 'slick';
            font-size: 6px;
            line-height: 20px;
            ...
        }
    

    喜欢这个

        .slick-dots li button:before
        {
            font-size: 20px;
            line-height: 20px;
            ...
        }
    

    【讨论】:

      猜你喜欢
      • 2011-04-16
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-02-18
      • 2018-01-14
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多