該模塊實現了一個簡單的幻燈片,博客相關文章 正是基於此模塊開發的。
Module | github.com/hbstack/slide |
---|---|
Repository | ⭐ Please consider giving a star if your like it. |
Stars | |
Version | |
Used by | |
Requirements | |
License | |
Usage | See how to use modules. |
1<div class="slide">
2 <div class="slide-inner row row-cols-3">
3 <div
4 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
5 style="height: 200px;">
6 1
7 </div>
8 <div
9 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
10 style="height: 200px;">
11 2
12 </div>
13 <div
14 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
15 style="height: 200px;">
16 3
17 </div>
18 <div
19 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
20 style="height: 200px;">
21 4
22 </div>
23 <div
24 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
25 style="height: 200px;">
26 5
27 </div>
28 <div
29 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
30 style="height: 200px;">
31 6
32 </div>
33 <div
34 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
35 style="height: 200px;">
36 7
37 </div>
38 <div
39 class="slide-item col me-2 bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
40 style="height: 200px;">
41 8
42 </div>
43 <div
44 class="slide-item col bg-dark border border-5 d-flex align-items-center justify-content-center text-white"
45 style="height: 200px;">
46 9
47 </div>
48 </div>
49 <button class="slide-control-left">Prev</button>
50 <button class="slide-control-right">Next</button>
51</div>