?? ????? ??? ?? ??? ????? ?? ??? ?????. ?? ??? ?? ??; ?? ?? ??? ????. ???? ? ??; ?? ???? ? ??; ????? ???? ?????.

?? ????? ?? ??? ???? ??

Bootstrap? ??? ?? ??? ???? ? ????? ???? ???? ??? ?? ??? ???? ?? ? ????. ?? ????? ?? ??? ???? ??? ??? ????.

1 ?? : ?? ??? ??

HTML ???? Bootstrap? CSS ? JavaScript ??? ??????.

 <code class="html"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/js/bootstrap.bundle.min.js"></script></code>

2 ?? : ?? ?? ??? ????

?? ?? ????? div ??? ????.

 <code class="html"><div id="myCarousel" class="carousel slide" data-bs-ride="carousel">
<ul>
<li> <code>id</code> ??? ?? ? ? ??? ?? ??? ???? ? ?????.</li>
<li> <code>carousel slide</code> ???? ??? ?? ???? ?????.</li>
<li> <code>data-bs-ride="carousel"</code> ??? ???? ???? ?? ??? ?????.</li>
</ul>
<p> <strong>3 ?? : ????? ??????</strong></p>
<p> ???? ???? <code>div</code> ??? ???? ????? ????.</p>
<pre class="brush:php;toolbar:false"> <code class="html"><div class="carousel-inner"> <!-- 添加幻燈片--> </div></code>

<li> ? ?????? ?? ? ?? (?? ??)? ?? ??? ?? ???? ????????.

4 ?? : ?? ???? ?? ??????

active ???? ???? ? ?? ????? ?? ????? ??????.

 <code class="html"><div class="carousel-item active"> <!-- 幻燈片內容--> </div></code>

5 ?? : ????? ???? ?????

??? ??? ???? ???? ?? ??? ?? ?? ???? ??????.

 <code class="html"><button class="carousel-control-prev" type="button" data-bs-target="#myCarousel" data-bs-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="visually-hidden">Previous</span> </button> <button class="carousel-control-next" type="button" data-bs-target="#myCarousel" data-bs-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="visually-hidden">Next</span> </button> <ol class="carousel-indicators"> <!-- 添加分頁器--> </ol></code>

<li> ???? data-bs-target ? data-bs-slide ??? ??? ????? ?????. <li> ? ????? ???? <li> ??? ??????.

??? ?? ? ??

?? ?? ?? ??, ????? ???? ?? ?? ?? ?? ?? ??? ??? ??? ?? ? ? ????. ?? ??? ?? ? ??? ??? ?? ??? ??? ?? ??? ??? ??????.