ホームページ > 記事 > ウェブフロントエンド > WebCSSコントロールページ(リンク方式とインポート方式の違い)_html/css_WEB-ITnose
まず理解してください:
【1】 Web ページの 2 つの要素「Table」と「DIV」は異なる目的を持っています まず、Table の目的はデータを保存することであり、DIV の目的は設定です。ページ構造
または W3C は、World Wide Web Consortium の略称で、中国語では W3C Organization または Wanwei Network Alliance です。 W3C 標準は標準ではなく、一連の標準の集合体であり、構造 (Structure)、プレゼンテーション (Presentation)、および動作 (Behavior) の 3 つの部分で構成されています。構造標準言語には主に XHTML と XML が含まれ、パフォーマンス標準言語には主に CSS が含まれ、動作標準言語には主にオブジェクト モデル (W3C DOM など) や ECMAscript などが含まれます。
一般的に「DIV」とは言えません+CSS」の場合はそのまま言ってください。「XHTML+CSS」の場合、この 2 つの名前は後者になる傾向があります。
【2】 CSS でページを制御するには、インライン スタイル、インライン スタイル、リンク スタイル、インポート スタイルの 4 つの方法があります
1. 次のようなインライン スタイル:
2: 次のようなインライン スタイル: ... .. & lt;/head & gt;
このスタイルは HTML ファイルを完全に分割します。と CSS ファイルを 2 つ以上のファイルに分割すると、ページ フレームの HTML コードとパフォーマンス CSS コードが完全に分離され、制作前と制作後のメンテナンスが非常に便利になります。この方法を使用することをお勧めします。入力 4: @import "style.css" のようなインポート スタイル
は、埋め込みスタイル
と同様に、HTML の初期化時に HTML ファイルにインポートされます。 ====== =========================================== ====== =========================================== ====== =======
【3】リンクスタイルとインポートスタイルの違い:
link
link は外部 CSS を Web ページに接続します。
@import
インポートとリンクの違いは、他の複数の CSS ファイルを 1 つの CSS ファイルに導入できることです。
@import を使用する理由
ほとんどの人が @import を使用するのは、古いブラウザが @import をサポートしていないためです。つまり、@import を使用して、最新のブラウザのみが解析できる CSS スタイルを導入できるということです。
もう 1 つの主な理由は、Web がページでは、複数の外部 CSS ファイルを導入する必要があります。リンクを使用して CSS を導入し、@import メソッドを使用してこの CSS ファイルに他のいくつかの CSS ファイルを導入できます。管理が簡単です。
リンクを使用する理由
。リンクを使用する主な理由の 1 つは、Firefox、Opera、Safari などの最新のブラウザーはすべて rel="alternate stylesheet" 属性 (つまり、ブラウザーで別のスタイルを選択する) をサポートしているため、ユーザーが CSS スタイルを切り替えられるようにできることです。 )、もちろん、JavaScript を使用して、IE がユーザーのスタイル変更をサポートするようにすることもできます
@import に関する小さな問題
Web ページの head タグが @import 属性のみを含む非常に単純な場合、ユーザーが遅いインターネット速度で閲覧すると、スタイルのないページが表示されますが、CSS ファイルがダウンロードされると適切なスタイルが表示されるようになります。この問題を回避するには、少なくとも 1 つのスタイルが存在することを確認する必要があります。
04-11 更新: @import により、CSS の全体的な読み込み時間が長くなり、たとえば、@ の後に配置されるファイルのダウンロード順序が変更されます。 import は CSS の前にロードされます。
どの方法を使用すればよいですか?
現時点では、モジュール化する必要がある場合は、小規模な Web サイトではリンクを使用する方が適切であると思われます。将来の CSS では、必ず @import を使用します。
たとえば、次の方法を使用できます: 3 つの CSS ファイル (base.css/common.css/page.css) と @import を作成します。それらを別の CSS ファイル ( style.css 、他の名前も使用できます) に追加し、ページ上の style.css のみを接続すると、コードをより適切に維持できます