ホームページ  >  記事  >  ウェブフロントエンド  >  CSSを使用する3つの方法

CSSを使用する3つの方法

藏色散人
藏色散人転載
2020-05-24 13:45:543133ブラウズ

CSSを使用する3つの方法

(1) リンク タイプ: (外部からインポートされた .css ファイル)

(より頻繁に使用されます) 2cdf5bf648cf2f33323966d7f58a7f3f は HTML が読み込まれる前に参照されます

Web ページの 93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1 タグ ペアの 2cdf5bf648cf2f33323966d7f58a7f3f を使用して外部スタイル シートを導入し、HTML ルールを使用して外部 CSS を導入します:

   <link href="./css/style.css" rel="stylesheet" type="text/css"/>

インポート タイプ: ( external import.css ファイル)

(未使用) @import は HTML が読み込まれた後にのみ参照され、スタイルを JS DOM モデルに挿入することはできません

外部 CSS ファイル、< の紹介;style> タグも記述します 93f0f5c25f18dab9d176bd4f6de5d30e タグ内で使用する構文は次のとおりです:

     <style type="text/css">
        @import "./css/style.css"
          /*@import url(./css/style.css)*/
      </style>

(2) 100db36a723c770d327fc0aef2ce13b1 タグの直下に埋め込み

を記述します。多くの場合、93f0f5c25f18dab9d176bd4f6de5d30e3c7b149cc556f883a18b3c490b028d4e にあります。

利点: 高速、すべての CSS コントロールがこのページ タグ用であり、スタイルは HTML ドキュメントで直接読み取られます;

欠点: A単一ページは肥大化して見え、他の HTML から参照できないため、比較的大量のコードとメンテナンスの問題が発生します

<style type="text/css">
      div{border:1px #ff0 solid}
    </style>

(3) インライン

(推奨されません) 複数の場所で使用できます頻繁に変更されないものは

<div style="border:1px #ff0 solid;">内容</div>

以上がCSSを使用する3つの方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcnblogs.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。