텍스트 CSS 스타일은 무엇입니까?-CSS 튜토리얼-php.cn

텍스트 CSS 스타일은 무엇입니까?

青灯夜游

풀어 주다： 2021-12-09 11:13:52

원래의

4970명이 탐색했습니다.

텍스트 CSS 스타일에는 다음이 포함됩니다: 텍스트 색상 "색상", 텍스트 방향 "방향", 문자 간격 "문자 간격", 텍스트 가로 정렬 "텍스트 정렬", 텍스트 장식 "텍스트 장식", 첫 번째 줄 들여쓰기 " 텍스트- 들여쓰기" 등

텍스트 CSS 스타일은 무엇입니까?

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

텍스트 CSS 스타일

Property	Description
color	텍스트 색상 설정
방향	텍스트 방향을 설정합니다.
letter-spacing	문자 간격 설정
line-height	line-height 설정
text-align	텍스트 가로 정렬
text-꾸밈	텍스트에 장식 추가
text-indent	요소에서 텍스트의 첫 번째 줄 들여쓰기
text-shadow	텍스트 그림자 설정
text-transform	요소의 제어 문자
unicode- bidi	텍스트 재작성 여부 설정 또는 반환
vertical-align	텍스트 수직 정렬
white-space	요소의 공백 처리 방식 설정
word-spacing	단어 간격 설정

몇 가지 CSS 텍스트 스타일을 소개하겠습니다.

text-indent 첫 줄 들여쓰기

첫 줄 들여쓰기는 문단의 첫 줄을 들여쓰기하는 것으로, 일반적으로 사용되는 텍스트 서식 효과입니다. 일반적으로 중국어로 글을 쓸 때 이와 비슷하게 시작 부분에 공백이 두 개 있습니다.

이 속성의 값은 음수일 수 있습니다.

구문:

text-indent:<length> | <percentage> | inherit

로그인 후 복사

tip: 초기 값은 0입니다.

적용 대상: 블록 수준 요소(블록 및 인라인 블록 포함)

상속: 예

백분율: 포함 블록의 너비에 상대적입니다.

사례: 첫 번째 문자 삭제

div {
    width: 200px;
    border: 1px solid black;
    text - indent: 0.5em;
}
div: first - letter {
    font - size: 30px;
    float: left;
}

로그인 후 복사

text-align 수평 정렬

수평 정렬은 요소의 텍스트에 영향을 미치는 수평 정렬입니다.

구문:

text-align: left | center | right | justify | inherit

로그인 후 복사

초기 값: left

적용 대상: 블록 수준 요소(블록 및 인라인 블록 포함)

상속: Yes

IE7 브라우저의 경우 text-align을 사용하면 가로만 변경되지 않습니다. 텍스트 정렬은 하위 블록 수준 요소의 가로 정렬도 변경합니다.

word-spacing

Word-spacing은 단어 간격을 말하며 텍스트나 단어 사이의 간격을 설정하는 데 사용됩니다. 실제로 "단어"는 일종의 공백으로 둘러싸인 공백이 아닌 문자의 문자열을 나타냅니다.

참고: 단어는 공백으로 구분됩니다. 단어 사이의 간격 = 단어 간격 + 공백 크기

참고: 단어 간격은 음수일 수 있습니다.

구문:

word-spacing: <length> | normal | inherit

로그인 후 복사

초기 값: 보통(기본값은 0)

적용 대상 : 모든 요소

상속: 예

letter-spacing 문자 간격

Letter 간격은 문자 간격을 나타냅니다.

참고: 문자 간격은 음수일 수 있습니다.

letter-spacing：<length> | normal | inherit

로그인 후 복사

초기 값: 일반(기본값은 0)

적용 대상: 모든 요소

상속:

text-transform text-transform

text-transform은 영어 대소문자 변환을 처리하는 데 사용됩니다.

구문:

text-transform:uppercase(全大写) | lowercase(全小写) | capitalize(首字母大写) | none | inherit

로그인 후 복사

초기 값: 없음

적용 대상: 모든 요소

상속: 예

text-장식Text-장식

텍스트 장식은 텍스트에 장식 선을 제공하는 데 사용됩니다.

참고: 텍스트 수정 줄의 색상은 텍스트 색상과 동일합니다.

구문:

text-decoration:none | [underline(下划线) || overline(上划线) || line-through(中划线)] | inherit

로그인 후 복사

초기 값: none

적용 대상: 모든 요소

상속: none

(학습 동영상 공유:

css 동영상 튜토리얼)

위 내용은 텍스트 CSS 스타일은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!