CSS2의 맥락 선택기

Question

왜 다음과 같은 특정 클래스 내에서 요소를 스타일링하는지 궁금합니다.

.reddish H1 { color: red }

Contextual Selectors의 CSS1 사양에서 올바른 구문의 예로 표시됩니다.

계단식 스타일 시트, 레벨 1

그러나 CSS2 사양의 예로는 표시되지 않습니다.

계단식 스타일 시트, 레벨 2

적어도 나는 그것의 예를 찾을 수 없습니다. 이에 대한 구문 규칙이 CSS2에서 변경 되었습니까? 아니면 단순히 올바른 구문으로 추론됩니까?

Answer 1

해당 구문은 정확하지만 몇 가지 이유로 예제가 변경되었을 수 있습니다.

첫째, 그들이하는 일에 대한 설명으로 클래스를 지명하는 것이 가장 모범 사례가 아닙니다. 의 경우 .reddish h1, 예제 CSS는 그것이 빨간색으로 채색되어야 함을 보여줍니다. 그러나 나중에 디자인이 변경되면 h1 실제로 파란색이어야합니다

.reddish h1 { color: blue; }

거의 말이되지 않습니다. 당신은 그들이 어떤 스타일을 표현 해야하는지가 아니라 페이지에서 그들의 기능이나 목적으로 수업을 지정해야합니다.

둘째, 수신 된 색상이 브라우저 해석으로 줄어들므로 색상에 키워드를 사용하는 것이 좋습니다. 대신, '빨간색'의 헥스 코드 '#FF0000'을 사용하여 모든 브라우저에서 정확한 색상을 얻어야합니다. (여기에서 가장 좋은 예는 아니지만 이상한 색상 키워드가 있습니다).

이 중 어느 것도 그렇게 나쁘지는 않지만, 둘 다 사양에서 예제가 변경된 이유를 더할 수 있습니다.

Answer 2

소문자로 요소를 써야합니다 (H1이 아닌 H1).