たまたま記事を見つけて、私と私のプロジェクトがフロートの解消に遅れていることがわかったので、整理したいと思います。
古いものから新しいものへの順序で、空のラベルに CSS を追加することで、最も古いメソッドが空のラベル メソッドになります。
.clear{clear:both;line-height:0;}でフロートをクリアします。ページの複雑なレイアウトを頻繁にフローティングする必要がある場合、このアプローチでは多くの空のタグが生成され、ページ上の無駄なタグの数が増加し、ページの最適化には役立ちません。
その後、after 疑似要素を使用する方法がありました:
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix{*zoom:1;}上記の方法はまだ面倒です。誰かがもっと簡単な方法を紹介しています。
.clearfix:after { content:"200B"; display:block; height:0; clear:both; } .clearfix {*zoom:1;}/*IE/7/6*/ここでの 200B はゼロです。このような幅スペース。visibility:hidden は必要ありません。
非常に効率的な方法もあります。
.clearfix:before,.clearfix:after{ content:""; display:table; } .clearfix:after{clear:both;} .clearfix{ *zoom:1;/*IE/7/6*/ }後述する 2 つの方法比較的シンプルで、プロジェクト エンジニアリングに使用できます。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
