p ~ span {
  color: red;
}

<p>태그 뒤에 있는 <span> 태그들 모두에게 적용된다. 

즉, <p>태그와 형제 관계여야하고, html상 <p> 뒤에 나와야 한다.

<span>이건 빨강이 아닙니다.</span>
<p>여기 문단이 있습니다.</p>
<code>그리고 코드도 있습니다.</code>
<span>이제 빨강입니다!</span>
<code>더 많은 코드가 있습니다.</code>
<span>이것도 빨강입니다!</span>

 

 

출처: https://developer.mozilla.org/ko/docs/Web/CSS/General_sibling_combinator

 

'HTML & CSS' 카테고리의 다른 글

rem VS px  (0) 2022.11.09

+ Recent posts