CSS 텍스트 셰도우

텍스트 그림자

text-shadow 속성이 텍스트에 그림자를 추가합니다.

가장 간단한 사용법은 수평 그림자(2px)와 수직 그림자(2px)만 지정하는 것입니다:

문자 그림자 효과!

예제

h1 {
  text-shadow: 2px 2px;
}

개인적으로 시도해 보세요

그런 다음, 그림자에 색상(빨간색)을 추가합니다:

문자 그림자 효과!

예제

h1 {
  text-shadow: 2px 2px red;
}

개인적으로 시도해 보세요

그런 다음, 그림자에 흐림 효과(5px)를 추가합니다:

문자 그림자 효과!

예제

h1 {
  text-shadow: 2px 2px 5px red;
}

개인적으로 시도해 보세요

ヒント：방문하세요 CSS 폰트 이 장에서는 글자, 텍스트 크기 및 텍스트 스타일을 변경하는 방법을 배웁니다.

ヒント：방문하세요 CSS 텍스트 효과 이 장에서는 다양한 텍스트 효과를 구현하는 방법을 배웁니다.

모든 CSS 텍스트 속성

속성 설명
color 텍스트의 색상을 설정합니다.
direction 텍스트의 방향/쓰기 방향을 지정합니다.
letter-spacing 문자 간격을 설정합니다.
line-height 줄 높이를 설정합니다.
text-align 텍스트의 수평 정렬 방식을 지정합니다.
text-decoration 텍스트에 장식 효과를 추가합니다.
text-indent 텍스트 블록의 첫 번째 줄의 들여쓰기를 지정합니다.
text-shadow 텍스트에 그림자 효과를 추가합니다.
text-transform 텍스트의 대소문자를 제어합니다.
text-overflow 사용자에게 텍스트의 표시되지 않은 부분을 어떻게 설명해야 하는지 지정합니다.
unicode-bidi direction 속성과 함께 사용하여, 동일한 문서 내 다양한 언어를 지원해야 하는지 설정하거나 반환합니다.
vertical-align 텍스트의 수직 정렬 방식을 지정합니다.
white-space 요소 내 공백 처리 방법을 지정합니다.
word-spacing 设置单词间距。