先生にセレクタの質問をした際、課題をいただきました！！！
ぜひ、解いてみてください
・section > best
・section.wrapper > best
・section &.best
・section a.best .best
・section .wrapper .best > span
・section .wrapper .best span
・section.wrapper .best span.open
・ td + ul > li
・td + ul li a.best
答えは…
・section > best
sectionタグ内の子要素.bestにCSSが適応される。
・section.wrapper > best
.wrapperというclassが指定されているsectionタグ直下(一つ下の階層の子要素のみにCSSが適応される)の.bestにCSSが適応される。
・section &.best
sectionタグと.bestの両方を満たしている場合適応される。
・section a.best .best
sectionタグ内にある子要素で、bestという名のついたaタグ内にある、bestに適応される。
・section .wrapper .best > span
sectionタグの下の子要素にある、class名が.wrapperである子要素の下のclass名がbestの直下にある子要素のspanタグに適応される。
・section .wrapper .best span
sectionタグの中のwrapperの下のbestの下のspanタグに適応される。
・section.wrapper .best span.open
class名がwrapperと設定されているsectionの子要素のbestの子要素であるclass名がopenのspanタグに適応される。
・td + ul > li
td要素と同レベル(同じ階層)で隣接する、ul要素の直下にあるli要素に適応される。➡＋同じ階層のすぐ後ろの要素にのみ適用される。
・td + ul li a.best
td要素と同レベルにあるul要素の下の子要素liのclass名がbestのa要素に適応される。
でした。先生に教わるまで意外とできなかったのでブログに書きました！！
以上です。
もりけん塾 https://terracetech.jp/ourvalue/morikenjuku/
もりけん先生ブログhttps://terracetech.jp/ourvalue/morikenjuku/
コメント