Simple HTMLHTMLリファレンス

Main Menu

おすすめリンク

Site Info.

HTMLリファレンス

CSSリファレンス

その他の記事

CSSリファレンス インデックス

スポンサーリンク

CSSリファレンス

SELECTORSセレクタTOPCSSSelector

  1. セレクタ一覧
  2. 汎用セレクタGeneral selectors
  3. 属性セレクタAttribute selectors
  4. 擬似クラスPseudo-classes
  5. 擬似要素Pseudo-elements
  6. セレクタと演算子Combinator
  7. セレクタの優先順位Priority

セレクタの基本

セレクタとは

セレクタとは、スタイルを適用したい対象を記述したもので、要素とスタイルを関連付ける上で欠かすことの出来ない機能です。 また、複数のセレクタを組み合わせて、様々な条件で文書内から目的の要素を見つけ出すための仕組みを持っています。

セレクタとマッチング

CSSでは、要素を見つけ出す方法として、要素の先頭タグに含まれる文字列やキーワード、属性名や属性の値などの一致を参照します。このとき、セレクタが対象要素を特定するために指定した条件と合致することをマッチングと言います。

セレクタで指定可能なもの

セレクタには、要素を構成する文字列のどの部分でもマッチングの対象に指定することができます。少し詳しく説明すると、要素の先頭タグを構成する要素タイプや属性・属性値などの要素の部位、あるいはその内容などを指定の対象とすることができます。また、これらの指定対象とする部位や機能によって、セレクタの名称がカテゴリ分けされています。

※ 要素の構成

要素の構成

※ セレクタに指定可能な要素型

セレクタに指定可能な要素型

複数セレクタの組み合わせパターンマッチング

複数セレクタを演算子(コンビネーター)で繋げることによって、ANDやOR検索と同じような複合条件の指定が可能です。また、要素の上下関係や並び順といった構造的なパターンの指定(パターンマッチング)が可能です。

これらのパターンマッチングをうまく活用すれば、不要なidやclass属性を減らし、Webサイトのデータ量を減らすことが可能です。

スポンサーリンク
Copyright (C) 2010 Simple HTML. All Rights Reserved.