css

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

--- css [2019/03/14 02:50] – nullpon
+++ css [2026/02/17 07:11] (現在) – [疑似クラスセレクタ] nullpon
@@ 行 26: / 行 26: @@
 |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-last-of-type(n)|兄弟要素中のE要素で後ろからn番目のもの|
@@ 行 36: / 行 36: @@
 |E:last-of-type|兄弟要素中のE要素で最後のもの ＝ E:nth-last-of-type(1)|
 |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:first-child|兄弟の中で最初の要素であるE|
@@ 行 93: / 行 93: @@
 ===== CSS振り分け =====
+[[https://developer.mozilla.org/ja/docs/Web/CSS/Media_Queries/Using_media_queries|メディアクエリの使用 - CSS: カスケーディングスタイルシート | MDN]]
 ==== 外観モードによる振り分け ====
@@ 行 102: / 行 104: @@
 <link rel="stylesheet" href="light.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>
@@ 行 134: / 行 136: @@
 <!-- PC用 -->
 <link rel="stylesheet" media="screen and (min-device-width: 1025px)" href="pc.css">
 </code>

css.1552531844.txt.gz · 最終更新: 2019/03/14 02:50 by nullpon