css - ボックスサイズのグローバルセレクター

Question

box-sizing一部の開発者は、Web プロジェクト全体の一般的な方法として、グローバル セレクターで を使用していると読みました。これはベストプラクティスですか、それとも避けるべきですか? そしてパフォーマンスについて？

*{ 
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
   box-sizing:border-box; 
} 

Answer 1

簡単な答え: はい、問題なく使用できます。

最適化されたコード スニペットを次に示します。

/* apply a natural box layout model to all elements, but allowing components to change */
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

詳細については、ここを参照してください。

http://www.paulirish.com/2012/box-sizing-border-box-ftw/

Answer 2

これはベスト プラクティスです。

これを読む：

http://learnlayout.com/box-sizing.html

Answer 3

はい、それはベスト プラクティスですが、IE 7 やその他の古いブラウザーも対象としている場合、レイアウトが歪んでしまいます。ボックスのサイズ変更はサポートしていません。したがって、それに応じて使用してください。