我正在使用 Bootstrap 5,我有這個例子:
如您所見,我正在嘗試向 LI 添加一些按鈕:
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown button
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
<li><a class="dropdown-item" href="#">Something here</a><button>A</button><button>B</button><button>C</button></li>
</ul>
</div>
我想讓它們在右邊行內。
我怎樣才能做到這一點?
uj5u.com熱心網友回復:
您可以為此使用 Flex 布局:https ://getbootstrap.com/docs/5.0/utilities/flex/
試試這個代碼?
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown button
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
<li class="d-flex gap-2">
<a class="dropdown-item me-auto p-2" href="#">Something here</a>
<button class="p-2">A</button>
<button class="p-2">B</button>
<button class="p-2">C</button>
</li>
</ul>
</div>
uj5u.com熱心網友回復:
編輯:考慮使用 flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/
<li class="d-flex justify-content-between">
<a class="dropdown-item" href="#">Something here</a>
<div>
<button>A</button>
<button>B</button>
<button>C</button>
</div>
</li>
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/429616.html
下一篇:更改箭頭填充引導輪播-角度
