CSSフロートクリーンアップ、clear:bothタグを使用しません。
1844 ワード
たとえば: Some Conttent このコードをプレビューすると、最外層の親要素floatを発見します。 containerは、表示されていません。これは、サブ要素が浮動して文書の流れから離れてしまい、親要素のheightがゼロになったからです。コードを変更すると: Some Conttent 浮動小数点を整理するコードがもう一つ増えました。これは良いCSSコード習慣ですが、この方法は無駄な要素を増加させます。ここではより良い方法があります。HTMLコードを次のように修正します。 Some Conttent CSSクラスを定義し、「フロートクリーンアップ」の制御を行う：
.clearfix:after {}{
content: ".";
clear: both;
height: 0;
visibility: hidden;
display: block;
} /* Firefox ， Firefox ， IE */
.clearfix {}{
display: inline-block;
} /* Mac IE */
/**//* Hides from IE-mac \*/
* html .clearfix {}{height: 1%;} /* win IE */
.clearfix {}{display: block;} /* display: inline-block; ， */
/**//* End hide from IE-mac */