回答編集履歴

説明を修正しました

2022/02/27 05:50

投稿

スコア917

test CHANGED Viewed

@@ -5,7 +5,7 @@
 そのため、要素を追加せずにfirst-childで実現するのは厳しそうです。
 無理矢理ですが、以下のCSSを考えてみました。
-「classに[item sub]を持つliが直前の要素ではない」かつ「ul配下でclassに[item sub]を持つli」に対して、スタイルを当てる方法です。
+「classに[item sub]を持つliが前に存在しない」かつ「ul配下でclassに[item sub]を持つli」に対して、スタイルを当てる方法です。
 ```CSS
 ul li.item {
   background-color: #eee;

想定外パターンを網羅するようにセレクタを修正

2022/02/27 05:46

投稿

スコア917

test CHANGED Viewed

@@ -16,11 +16,11 @@
   background-color: #aaa;
 }
-ul li.item.sub:not(li.item.sub+li.item.sub) {
+ul li.item.sub:not(li.item.sub ~ li.item.sub) {
-  background-color: #666; /* 直前の要素が[li.item.sub]でない場合に[ul li.item.sub]に対してスタイルを当てる */
+  background-color: #666; /* 前に[li.item.sub]の要素が存在しない場合に[ul li.item.sub]に対してスタイルを当てる */
 }
 ```
 追記.
-すみません、ただこの後に一つでも[item sub]以外の要素が挟まってしまうと、再びスタイルが当たってしまいますね。
-あくまでも案として受け取ってください。
+何度か回答を修正してすみません。
+最初に出した案では実現できないケースがあったので、セレクタの指定を一部直しました。

問題があったの補足

2022/02/27 05:38

投稿

スコア917

test CHANGED Viewed

@@ -20,3 +20,7 @@
   background-color: #666; /* 直前の要素が[li.item.sub]でない場合に[ul li.item.sub]に対してスタイルを当てる */
 }
 ```
+追記.
+すみません、ただこの後に一つでも[item sub]以外の要素が挟まってしまうと、再びスタイルが当たってしまいますね。
+あくまでも案として受け取ってください。

括弧の修正

2022/02/27 04:58

投稿

スコア917

test CHANGED Viewed

@@ -5,7 +5,7 @@
 そのため、要素を追加せずにfirst-childで実現するのは厳しそうです。
 無理矢理ですが、以下のCSSを考えてみました。
-「classに[item sub]を持つliが直前の要素ではない] かつ[ul配下でclassに[item sub]を持つli」に対して、スタイルを当てる方法です。
+「classに[item sub]を持つliが直前の要素ではない」かつ「ul配下でclassに[item sub]を持つli」に対して、スタイルを当てる方法です。
 ```CSS
 ul li.item {
   background-color: #eee;

コメントの修正

2022/02/27 04:57

投稿

スコア917

test CHANGED Viewed

@@ -17,6 +17,6 @@
 }
 ul li.item.sub:not(li.item.sub+li.item.sub) {
-  background-color: #666; /* li.item.sub の次のタグにli.item.subが来ない場合だけスタイルを当てる */
+  background-color: #666; /* 直前の要素が[li.item.sub]でない場合に[ul li.item.sub]に対してスタイルを当てる */
 }
 ```

説明に誤りがあったので修正しました

2022/02/27 04:56

投稿

スコア917

test CHANGED Viewed

@@ -5,7 +5,7 @@
 そのため、要素を追加せずにfirst-childで実現するのは厳しそうです。
 無理矢理ですが、以下のCSSを考えてみました。
-「classに[item sub]を持つ[li]以外の要素」に対して、スタイルを当てる方法です。
+「classに[item sub]を持つliが直前の要素ではない] かつ[ul配下でclassに[item sub]を持つli」に対して、スタイルを当てる方法です。
 ```CSS
 ul li.item {
   background-color: #eee;