光滑的轮播 - 如何更改默认按钮

Question

我是第一次与Slick Carousel合作.我目前正在处理的项目需要通过CDN加载的大多数文件.如何替换通过托管Jquery加载的"Next"和"Previous"的默认按钮？

截至目前,它只是一个带有Text的按钮,我想用FontAwesome箭头图标替换它.

<h1> One Slider At a Time </h1>
<div class="slider">
    <div><h3>1</h3></div>
    <div><h3>2</h3></div>
    <div><h3>3</h3></div>
  </div>

这是我的演示

Answer 1

使用CSS来指定content的.slick-prev::before和.slick-next::before:

.slick-prev::before {
  content: "<";
}
.slick-next::before {
  content: ">";
}

https://jsfiddle.net/ryanpcmcquen/z6qoz1mh/

如果你想使用FontAwesome只需加载它并指定unicode字符作为内容,例如:

.slick-prev::before, .slick-next::before {
  font-family: FontAwesome;
}
.slick-prev::before {
  /* fa-arrow-circle-left */
  content: "\f0a8";
}
.slick-next::before {
  /* fa-arrow-circle-right */
  content: "\f0a9";
}