bootstrapドロップダウンで上向き矢印を削除

Question

私はTwitterのブートストラップを使用していて、ドロップダウンメニューの上向きの矢印を削除したいと思います。 bootstrap.cssで参照が見つかりません。

.navbar .dropdown-menu:after { 
content: ''; 
display: inline-block; 
border-left: 6px solid transparent; 
border-right: 6px solid transparent; 
border-bottom: 6px solid #000; /* change color here, modified for a black arrow */ 
position: absolute; 
top: -6px; 
left: 10px; 
} 

Answer 1

私はbootstrap.cssファイルを編集することができますお勧めしません。あなたは、このようなそのコンポーネントの矢印を非表示にするカスタムスタイルシートでスタイルを上書きすることができます。

.dropdown-menu:after { 
    border: none !important; 
    content: "" !important; 
} 

をこの方法で、あなたも、特定のドロップダウンのための上書きを行うことができます。たとえば、あなたのドロップダウンは、ID my_dropdownを持つ要素の子だった場合、あなたができる：

#my_dropdown .dropdown-menu:after { 
    border: none !important; 
    content: "" !important; 
} 

この特定のドロップダウンのためにそれを隠しながらこれは、あなたが他のドロップダウンの矢印を持つことができるようになります。

Answer 2

次のCSSが私の仕事：あなたは2つのセレクタのいずれかを削除した場合

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

、矢印からいくつかの詳細はまだ残っているだろう - グレーや白い三角形のいずれか。

（ただ、受け入れ答えは私のために働かなかったとして、誰かが、後で答えを探している場合には、これを追加することにしました。）

Answer 3

あなたはまた、行うことができます。

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

この意志矢印とその影を無効にします。