我使用這個輪播并喜歡它：https : //mdbootstrap.com/snippets/jquery/ascensus/135508#html-tab-view
唯一的問題是，我希望控制元件圍繞指標。
目前，它是這樣的：
< >
SLIDE SLIDE SLIDE
...
我想要的是：
SLIDE SLIDE SLIDE
< ... >
已經嘗試過：
<!--Controls-->
<div class="controls-top">
<a class="btn-floating" href="#multi-item-example" data-slide="prev"><i class="fa fa-chevron-left"></i></a>
<!--Indicators-->
<ol class="carousel-indicators">
<li data-target="#multi-item-example" data-slide-to="0" class="active"></li>
<li data-target="#multi-item-example" data-slide-to="1"></li>
<li data-target="#multi-item-example" data-slide-to="2"></li>
</ol>
<!--/.Indicators-->
<a class="btn-floating" href="#multi-item-example" data-slide="next"><i class="fa fa-chevron-right"></i></a>
</div>
<!--/.Controls-->
任何人都知道我如何在沒有任何野生 css 的情況下使用引導類實作這一點？
uj5u.com熱心網友回復：
將旋轉木馬的封閉 div 更改為 a flex，更改 flex-order 并管理額外的邊距做到了。
代碼變成：
<div id="multi-item-example" class="carousel slide carousel-multi-item d-flex align-items-center justify-content-center flex-column" data-ride="carousel">
<div class="controls-top order-1 d-flex">
<a class="btn-floating" href="#multi-item-example" data-slide="prev"><i class="fa fa-chevron-left"></i></a>
<ol class="carousel-indicators my-0 mx-5 position-relative d-flex align-items-center">
<li data-target="#multi-item-example" data-slide-to="0" class="active m-0 mr-2"></li>
<li data-target="#multi-item-example" data-slide-to="1" class="m-0 mr-2"></li>
<li data-target="#multi-item-example" data-slide-to="2" class="m-0 mr-2"></li>
</ol>
<a class="btn-floating" href="#multi-item-example" data-slide="next"><i class="fa fa-chevron-right"></i></a>
</div>
<div class="carousel-inner" role="listbox">
// carousel images and stuff
</div>
</div>
參考這里： 片段
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/391657.html
標籤：推特引导 bootstrap-4 引导程序
下一篇：單擊時不會打開模態