12

Twitter Bootstrap フレームワークのドロップダウン メニューに表示される矢印を削除しようとしています。誰かが矢を取り除く方法を考え出しましたか?

4

9 に答える 9

26

リンクからキャレット クラスを削除すると、ナビゲーション バーから矢印が削除されます。

.dropdown-menu::before, 
.dropdown-menu::after {
    border: none;
    content: none;
}

ドロップダウンメニュー自体から小さなタブを削除します。

于 2012-06-23T23:15:31.680 に答える
22

から: https://getbootstrap.com/2.3.2/components.html#buttonDropdowns

<div class="btn-group">
  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
    Action
    <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
    <!-- dropdown menu links -->
  </ul>
</div>

削除する<span class="caret"></span>と、矢印は表示されません。

開発者を使用して試してみました。コンソールで、動作するようです。

于 2012-04-20T11:00:13.683 に答える
4

既存の Bootstrap ドロップダウンの例をコピーすると、メニュー ボタン タグは次のようになります。

<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Menu Name</button>

クラスを削除dropdown-toggleすると、矢印 (またはキャレット) が削除されます。

<button class="btn btn-primary" type="button" data-toggle="dropdown">Menu Name</button>
于 2017-08-30T00:05:32.270 に答える
2

ドロップダウン メニューから border-bottom を削除するだけで、ナビゲーション バーから矢印が削除されます。

.navbar .nav > li > .dropdown-menu:before, .navbar .nav > li > .dropdown-menu:after{
    border-bottom: none;
}
于 2015-03-19T05:46:37.840 に答える
1

最善の解決策は、に追加することであることがわかりましoverflow:hidden;た.dropdown-menu

于 2013-08-22T08:06:23.470 に答える