ホームページ > 記事 > ウェブフロントエンド > CSSスタイルシートにはどのような種類があるのでしょうか?セレクターの優先順位とは何ですか?
CSS スタイル シートには、インライン スタイル シート、内部スタイル シート、外部スタイル シートの 3 種類があります。セレクターの優先順位は、「ユニバーサル セレクター > 要素セレクター > クラス セレクター > 属性セレクター > 擬似クラス > ID セレクター > インライン スタイル」です。
このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
CSS スタイル シートにはどのような種類がありますか?
CSS スタイルが記述される位置 (または導入方法) に応じて、CSS スタイル シートは次の 3 つのカテゴリに分類できます。
1. インライン スタイル シート
インライン スタイルは、コード行内のタグに CSS スタイルを直接配置するもので、通常はタグの style 属性に配置されます。タグに直接挿入するのが最も直接的な方法ですが、変更するのが最も不便なスタイルでもあります。
例:
<p style="background-color: #999900">行内元素,控制段落-1</p>
2. 内部スタイル シート
内部スタイル シートは、c9ccee2e6ea535a969eb3f532ad9fe89 タグに含まれています。 6c1d9d1c5e7690ed0ad94b24a12b6eb7 タグは内部スタイル シートを表します。
Web ドキュメントに複数の c9ccee2e6ea535a969eb3f532ad9fe89 タグが含まれている場合は、そのドキュメントに複数の内部スタイル シートが含まれていることを意味します。
例:
<style> div { color: blue; font-size: 16px; } </style>
3. 外部スタイル シート
CSS スタイルが Web ページ ドキュメントの外部のファイルに配置されている場合、それは次のように呼ばれます。外部スタイル テーブル、CSS スタイル シート ドキュメントは外部スタイル シートを表します。
実際、外部スタイル シートは拡張子 .css を持つテキスト ファイルです。 CSS スタイル コードをテキスト ファイルにコピーし、.css ファイルとして保存すると、それは外部スタイル シートになります。
HTML ページでは、9b3737d50531bee70b4389e7b6fabf02 タグを使用してファイルを導入します。具体的な導入コードは次のとおりです:
<link rel="styleheet" href="css文件路径">
複数のスタイル シートの優先順位:
インラインスタイル インラインスタイル > 内部スタイルシート > 外部スタイルシート 外部スタイルシート > ブラウザデフォルトスタイル
以下はセレクタの優先度の説明と重みの説明です, そこで初心者向けチュートリアルから抜粋しました
優先度はブラウザによって決定され、どの属性値が要素に最も関連しているかを判断することによって要素に適用されます。優先度は、セレクターから構成されるマッチング ルールによってのみ決定されます。
優先度は、指定された CSS 宣言に割り当てられる重みであり、一致するセレクター内の各セレクター タイプの値によって決まります。
セレクターの優先順位は何ですか?
以下は、優先度の高いセレクターのリストです:
!重要なルールがスタイル宣言に適用される場合、スタイル宣言は、宣言リスト内のどこにあるかに関係なく、CSS 内の他の宣言をオーバーライドします。ただし、!重要なルールは優先順位とは関係ありません。 ! important を使用すると、スタイルシートの元のカスケード ルールが変更され、デバッグが困難になるため、推奨されません。
いくつかの経験則:
# ではなく、スタイル ルールの優先順位を使用して問題を解決することを検討してください。
## Never
Never#重み計算:
(学習ビデオ共有: css ビデオ チュートリアル)
以上がCSSスタイルシートにはどのような種類があるのでしょうか?セレクターの優先順位とは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。