滑動旋轉木馬 - 如何更改默認按鈕

Question

我正在與Slick Carousel第一次。我目前正在處理的項目需要通過CDN加載大部分文件。如何替換通過其託管的Jquery加載的「Next」和「Previous」的默認按鈕？

截至目前，它只是一個帶有文字的按鈕，我想用一個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> 

這裏是我的Demo

Answer 1

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

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

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

如果你想使用FontAwesome只是load that in和指定的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"; 
}