0

ソース: http://twitter.github.com/bootstrap/components.html#navbar

ドロップダウン メニューの小さな黒い三角形を作成するために、Twitter は次の CSS を使用しています。

.caret 
{
    display: inline-block;
    width: 0;
    height: 0;
    vertical-align: top;
    border-top: 4px solid black;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    content: "";
    opacity: 0.3;
    filter: alpha(opacity=30);
}

使ってみ<b class="caret"></b>ましたが色はグレーです。Twitter Bootstrap ページで content: "" を削除すると、三角形も灰色になります。HTMLスタイルのタグにコードを追加すると

<b style="-the code-"></b>あるべきように黒いです。なぜこうなった ?

更新

コードは同じですが、CSS ファイルにある場合opacity: 0.3 、三角形が灰色になりますが、HTML スタイル タグでこれが発生しないのはなぜですか?

4

1 に答える 1

0

含んでいるので灰色にはなりません

content: "";

の中へ

<b style="-the code-"></b>

二重引用符が干渉しています。それを修正するには

<b style="... content: ''; ..."></b>

それは動作します -デモ

于 2012-07-15T23:22:06.583 に答える