◀ 5.

属性セレクタ

▶
編集
ページの作成
テンプレートを更新

ページの作成

親となるページを選択してください。

ページは必ず何かしらの親ページに紐づきます。
親ページに紐づくページを子ページといいます。
例： 親=スポーツ, 子1=サッカー, 子2=野球

子ページを親ページとして更に子ページを作成することも可能です。
例： 親=サッカー, 子=サッカーのルール

親ページはいつでも変更することが可能なのでとりあえず作ってみましょう！

特定の属性が指定されている要素、特定の属性に特定の値が指定されている要素を適用対象として指定できるのが属性セレクタと言う。

 

属性名の属性が指定されている要素

p[title] { color: #fff; }

 

属性名の属性に属性値の値が指定されている要素①

p[id="main"] { color: #fff; }

 

属性名の属性に属性値の値が指定されている要素②

（属性値として複数の値がスペースで区切られて設定されているような属性に対し、

指定した値が属性値のいずれか一つに一致する要素を対象とする場合）

p[class~="main"] { color: #fff; }

 

属性名の属性に属性値の値が指定されている要素③

（値全体、ハイフン区切りの値の前半が一致する要素が対象。

「en-US」などに使用)

*[lang|="en"] { color: #ff0000; }

 

属性名の属性の値が属性値の始めで始まる要素

img[src^="abc"]{border: 2px; }

 

属性名の属性の値が属性値の終りで終わる要素

img[src$=".jpg"]{border: 2px; }

 

属性名の属性の値が属性値の一部を含む要素

img[src*="/bnr/"] { padding: 1px; }

 

 

 

 

編集
ページの作成
テンプレートを更新

ページの作成

親となるページを選択してください。

ページは必ず何かしらの親ページに紐づきます。
親ページに紐づくページを子ページといいます。
例： 親=スポーツ, 子1=サッカー, 子2=野球

子ページを親ページとして更に子ページを作成することも可能です。
例： 親=サッカー, 子=サッカーのルール

親ページはいつでも変更することが可能なのでとりあえず作ってみましょう！
子ページ
子ページはありません
同階層のページ
  1. タイプセレクタ
  2. ユニバーサルセレクタ
  3. クラスセレクタ
  4. IDセレクタ
  5. 属性セレクタ
  6. 疑似クラス

人気ページ

最近更新/作成されたページ