≪ Today I learned.
RSS購読
    公開日
    タグ
    CSS
    著者
    ダーシノ

    兄弟セレクタ(次兄弟結合子)で兄要素を取得する

    :has()擬似クラスと兄弟セレクタ(次兄弟結合子)を使うことで、兄要素が取得できる。

    対応ブラウザは以下の通り。

    <span></span>
    <span></span>
    /* 兄要素 */
    span:has(+ span)::after {
     content: "より優れた";
    }
    
    /* 弟要素 */
    span + span {
     content: "は存在しない";
    }

    デモ