포함된 클래스를 사용하여 HTML에서 다양한 텍스트를 렌더링하는 방법

Question

코드가 포함된 카테고리/카테고리에 따라 다른 텍스트를 표시하고 싶습니다(예: 카테고리가 .category-rabbitmq인 경우).

이것은 카테고리가 .category-rabbitmq일 때 배경을 변경합니다.

<style>
.category-rabbitmq
{
    배경 이미지: url('https://www.nastel.com/wp-content/uploads/2022/04/nastel_navigator_xpress.png') !important;
    배경 크기: 표지;
}
</스타일>
<themainbody></themainbody><br>

에 대해 자세히 알아보세요.

항상 변수를 표시합니다.

<style>
본체::이후 {
  콘텐츠: "RabbitMQ";
}
</스타일>
<themainbody></themainbody><br>

에 대해 자세히 알아보세요.

그러나 카테고리 설정 시 변수만 표시하는 경우에는 작동하지 않습니다.

<style>
.category-rabbitmq
{
  본체::이후 {
  콘텐츠: "RabbitMQ";
}
</스타일>
<themainbody></themainbody><br>

에 대해 자세히 알아보세요.

도와주실 수 있나요?

Answer 1

CSS에는 규칙을 중첩할 수 없습니다(SCSS에서는 가능합니다). CSS에 중첩을 허용하는 첫 번째 공개 작업 초안이 있으므로 앞으로는 그렇게 할 수 있을 것입니다.

그러므로 다음과 같이 해야 합니다:

으아악

잘 모르겠어요.category-rabbitmq元素相对于themainbody有多少级。如果你知道themainbody是.category-rabbitmq的直接子元素，那么你可以更具体地使用子组合器并进行优化：>

으아악

CSS 하위 조합자 및 CSS 하위 조합자를 참조하세요.