| 両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン |
| css [2019/03/14 02:57] – nullpon | css [2026/02/17 07:11] (現在) – [疑似クラスセレクタ] nullpon |
|---|
| |E[attr$="hoge"]|値がhogeに後方一致するattr属性を持つE要素| | |E[attr$="hoge"]|値がhogeに後方一致するattr属性を持つE要素| |
| |E[attr~="hoge"]|値がhogeであるattr属性を持つE要素、値を複数もつ場合はどれか一つが一致すればよい| | |E[attr~="hoge"]|値がhogeであるattr属性を持つE要素、値を複数もつ場合はどれか一つが一致すればよい| |
| |%%E[attr|="hoge"]%%|値をハイフン区切りし、そのうちどれかがhogeであるattr属性を持つE要素| | |%%E[attr|="hoge"]%%|値が完全一致、もしくは値をハイフンで分割したとき先頭の値がhogeであるattr属性を持つE要素| |
| |
| ==== 疑似クラスセレクタ ==== | ==== 疑似クラスセレクタ ==== |
| |
| |E:root|ルート要素、HTML文書ではhtml要素のこと| | |E:root|ルート要素、HTML文書ではhtml要素のこと、なのでhtml:root以外意味なし、htmlは省略して:rootと記述する| |
| |E:nth-of-type(n)|兄弟要素中のE要素でn番目のもの| | |E:nth-of-type(n)|兄弟要素中のE要素でn番目のもの| |
| |E:nth-last-of-type(n)|兄弟要素中のE要素で後ろからn番目のもの| | |E:nth-last-of-type(n)|兄弟要素中のE要素で後ろからn番目のもの| |
| |E:last-of-type|兄弟要素中のE要素で最後のもの ＝ E:nth-last-of-type(1)| | |E:last-of-type|兄弟要素中のE要素で最後のもの ＝ E:nth-last-of-type(1)| |
| |E:only-of-type|兄弟にE要素がひとつしかない場合、そのE要素| | |E:only-of-type|兄弟にE要素がひとつしかない場合、そのE要素| |
| |E:nth-child(n)|兄弟の中でn番目にあるE要素| | |E:nth-child(n)|兄弟の中でn番目にあるE要素、nth-of-typeとの違いはE以外の要素も含めてn番目であること、つまりn番目がEでなければマッチしない| |
| |E:nth-last-child(n)|兄弟の中で後ろからn番目にあるE要素| | |E:nth-last-child(n)|兄弟の中で後ろからn番目にあるE要素| |
| |E:first-child|兄弟の中で最初の要素であるE| | |E:first-child|兄弟の中で最初の要素であるE| |
| <link rel="stylesheet" href="light.css"> | <link rel="stylesheet" href="light.css"> |
| <!-- ダークモードのCSS --> | <!-- ダークモードのCSS --> |
| <link rel="stylesheet" media="(prefers-color-theme: dark)" href="dark.css"> | <link rel="stylesheet" media="(prefers-color-scheme: dark)" href="dark.css"> |
| </code> | </code> |
| |
