React에서 상위 태그를 기반으로 하위 태그의 CSS를 추가하는 방법은 무엇입니까?

Question

아아아아

참고: 동적일 수 있습니다. H2는 상위 태그이고 동일한 태그에 스타일을 적용했으며 하위 태그에도 적용하고 싶습니다().

Answer 1

JSX 스타일 속성은 HTML 스타일 속성과 유사합니다. 스타일 속성과 속성 모두 CSS 속성만 허용합니다. 따라서 선택자, 의사 요소 또는 의사 클래스의 사용은 허용되지 않습니다.

스타일 속성 사용

다음을 바꾸세요:

으아아아

포함:

으아아아

더 명확하게:

으아아아

그러나 h2 요소에 대한 스타일만 정의하려고 하므로 더 많은 옵션이 있습니다.

CSS/SCSS

별도의 파일에 CSS 사용:

으아아아

그 중 .your-css.css 파일에는

이 포함되어 있습니다. 으아아아

중첩된 경우(.scss와 같은 전처리기를 사용하는 경우)

으아아아

CSS-in-JS

좀 더 "React" 솔루션을 고려하면 다음과 같은 CSS-in-JS를 사용할 수 있습니다. styled-components 자세히 알아보기

으아아아