最初に、タイトルに、これが here 、 here 、および here のように、重複した質問であると書かれています。このトピックで読んだものはすべて2年以上前のものです。その期間に多くの変化がありましたので、同じ考えをお勧めしますか?
以下に例を示します。スタイルシート内で@importを使用して、リセットCSSと他のいくつかのスタイルを取り込みます。 @import
から<link>
に変更する必要がありますか?これによると 記事 リンクを使用する必要があります。だから私は他の開発者に、これまでのところ本当に最高の方法は何ですかと尋ねます(2011年8月25日)
過去1年または2年で何かが変わったとしても、それほど多くはありません。また、私たちはそれから多くの同じブラウザを扱っているので、練習を変えるべきではありません。
<link>
は、@import
よりもすべての場合に優先されます。後者は、並行ダウンロードをブロックするためです。つまり、ブラウザーは、インポートされたファイルのダウンロード完了を待ってから、残りのコンテンツのダウンロードを開始します。
これはここで詳細に見ることができます:
http://www.stevesouders.com/blog/2009/04/09/dont-use-import/
したがって、@import
は便利かもしれませんが、それだけです。高速な読み込み時間を本当に活用したい場合は、最小限のスタイルシート(おそらくほとんどの場合1つ)を使用し、効率的なセレクター(通常のもの)で適切なCSSを記述し、それを縮小して、<link>
タグを使用します。
これはコメントになる予定でしたが、長すぎました:
@import
(代わりにisが非常に便利です)の代わりに、サイトを公開するときにファイルを1つに結合する必要があります。とにかくその時点で微調整するべきではありません。それを縮小するのに役立つツールがいくつかあります。個人的に、PHPを使用して、個別のCSSファイル(<link>
タグで参照するファイル)に書き込まれるすべてのCSSファイルを定義する構成ファイルがあり、キャッシュバージョンが古い場合(どちらか)手動または自動で決定)、それらを結合/縮小し、コンテンツを「キャッシュ」ファイルに書き込み、タイムスタンプクエリ文字列を返し、CSSファイル名に追加して新しいダウンロードを強制します。
PHP=も使用している場合、 cssmin を強くお勧めします。スタイルシートで@import
を解析し、コンテンツを1つのファイルにプルできます。縮小のすべての側面を処理します。