1

この質問の解決策を探しているときに、:after疑似クラスでクリア要素を追加しようとしました。それは私が望むことをしましたが、私が期待した理由ではありません-物事を絞り込んだ後、次のように定義すると要素がクリアされることがわかりました:

.right_field > div:after
{
    content: "style=\"foo\"";
}

私が期待するのは、テキストを内の要素style="foo"の最後に追加することですが、代わりに何も視覚的に追加せず、要素をクリアして、フローティングの子をラップします。div.right_field

デモンストレーションについては、次のフィドルを参照してください。foocontent プロパティ内 の from を削除してみて、要素がクリアされず、代わりに各要素にテキストが追加されることを確認してください。http://jsfiddle.net/dNJxd/5/

なぜこれが起こるのでしょうか? これは信頼できる機能ですか? Chrome、Firefox、IE7-9 でテストしたところ、すべて同じように動作しました。

4

1 に答える 1

1

あなたの例では、要素のstyle="foo"後にテキストを追加しています。div（テストされたブラウザーのリストから）これを行わない唯一のブラウザーは、::after疑似クラスをサポートしていないため、IE7です。

たぶん、 JSFiddleの結果ウィンドウをもう少し伸ばす必要があります。

また、これはフロートをクリアしません-追加されたテキストはフロートされないため、親divに高さを与えるだけです。divのコンテンツの高さが追加されたテキストよりも大きい場合でも、境界線の折りたたみは発生します。

于 2012-05-15T10:41:04.520 に答える