상속되는 CSS 속성 목록

김현준·2024년 11월 13일
0

html/css

목록 보기
18/27

Tailwind CSS에서는 CSS 기본 상속 규칙을 따르며, 특정 속성들만 상속된다.
상속되는 CSS 속성은 일반적으로 텍스트 및 글꼴 스타일과 관련된 것들이다.

1. color (텍스트 색상)

  • Tailwind 클래스: text-{color}

2. font-family (글꼴 패밀리)

  • Tailwind 클래스: font-{family}

3. font-size (글꼴 크기)

  • Tailwind 클래스: text-{size}

4. font-style (글꼴 스타일)

  • Tailwind 클래스: italic, not-italic

5. font-weight (글꼴 두께)

  • Tailwind 클래스: font-{weight}

6. text-transform (텍스트 변환)

  • Tailwind 클래스: uppercase, lowercase, capitalize, normal-case

7. text-indent (텍스트 들여쓰기)

  • Tailwind로는 직접 지원되지 않지만, 커스텀 스타일로 적용 가능

8. text-align (텍스트 정렬)

  • Tailwind 클래스: text-left, text-center, text-right, text-justify

9. line-height (줄 간격)

  • Tailwind 클래스: leading-{value}

10. letter-spacing (자간)

- Tailwind 클래스: `tracking-{value}`

11. text-decoration (텍스트 장식, 예: 밑줄)

- Tailwind 클래스: `underline`, `line-through`, `no-underline`

12. text-decoration-color (텍스트 장식 색상)

- Tailwind 클래스: `decoration-{color}`

13. text-decoration-style (텍스트 장식 스타일)

- Tailwind 클래스: `decoration-{style}` (e.g., `solid`, `dotted`, `dashed`, etc.)

14. text-decoration-thickness (텍스트 장식 두께)

- Tailwind 클래스: `decoration-{thickness}`

15. text-underline-offset (밑줄 위치 조정)

- Tailwind 클래스: `underline-offset-{value}`

16. text-shadow (텍스트 그림자)

- Tailwind로는 직접 지원되지 않지만, 커스텀 스타일로 적용 가능
profile
기록하자

0개의 댓글

관련 채용 정보