使用Swiper快速搭建輪播圖

1.網(wǎng)址:https://www.swiper.com.cn/
2.這里有演示效果(有pc端的和移動端的)

image.png

3.下載swiper里面需要的文件
image.png

4.這里選擇以4.5.3為例(單擊即可下載)
image.png

5.文檔目錄如下
image.png

6.首先我們在演示文檔找自己需要的效果(這個效果圖的序號為280)
image.png

7.接著我們就去我們下載的那個文件找對應的html
image.png

8.點那個效果圖進去,然后鼠標右鍵查看網(wǎng)頁源代碼
image.png

9.然后就需要復制html、css、js代碼到自己的網(wǎng)頁里面
10.三個復制完之后還需要把css文件和js文件這兩個文件引入
image.png

image.png

11.下面這兩個區(qū)別(兩個文件內(nèi)容是一樣的,不過swiper.min.css是壓縮后的)
image.png

12.引入結(jié)構
image.png

?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容