CSS 페이지 레이아웃(텍스트 스타일)에 대한 상식 요약

CSS에는 많은 지식이 있으며 우리가 그것을 모두 기억하는 것은 불가능합니다. 여가 시간에 CSS 페이지 레이아웃에 대한 몇 가지 일반적인 지식을 정리했습니다. 이 기사에서는 CSS 텍스트 스타일에 대한 일반적인 지식을 공유할 것입니다. 도움이 필요한 친구들이 참고하면 도움이 될 것 같아요.

1. 글꼴 유형

기본적으로 대부분의 사용자 시스템에서 지원되는 중국어 글꼴은 Song, Hei, Youyuan 및 Kai입니다. 기본적으로 지원되는 영어 글꼴은 Arial, Arial Black, Arial Narrow, Century Gothic, Comic SansMS입니다. 타임즈뉴로만 등등. 사용시에는 송나라와 아리알이 가장 많이 사용된다.

CSS는 글꼴 유형을 설정하는 글꼴 계열 속성을 제공합니다.

예: p{font-family: 宋体;}

참고: 여러 글꼴 속성을 동시에 설정하는 경우 우선순위가 높습니다.

2. 글꼴 크기

CSS는 글꼴 크기를 설정하는 글꼴 크기 속성을 제공합니다.

예: p{font-size: 12px;}

상대 크기

px, em, 10%, 더 크게, 더 작게(마지막 두 개는 상위 요소에 상대적임)

절대 크기

pt, pc, cm, mm

키워드

xx-small, x-small, small, Large, x-large,xx-large

3. 글꼴 굵게

CSS는 글꼴을 설정하는 글꼴 가중치 속성을 제공합니다. 대담해지세요.

예: p{font-weight: 굵게;}

숫자: 100, 200,...,900

키워드: 굵게, 굵게, 가벼움, 보통

4 텍스트 색상

CSS는 다음을 제공합니다. 색상 속성 텍스트 색상을 설정합니다.

예: p{color: red;}

색상 이름: red, green,… CSS는 글꼴을 기울임꼴로 설정하기 위해 글꼴 스타일 속성을 제공합니다. 일반, 기울임꼴, 경사의 세 가지 속성 값이 있습니다.

예: p{font-style: italic;}

6. 밑줄, 밑줄 및 취소선

CSS는 밑줄, 밑줄 및 취소선을 설정하는 글꼴 장식 속성을 제공합니다. 네 가지 속성 값이 있습니다: 밑줄(밑줄), 깜박임(깜박이는 텍스트), 윗줄(윗줄), 줄바꿈(취소선).

예: p{font-꾸밈: 밑줄;}

7. 영문 대소문자

CSS는 영문 대소문자를 설정하는 글꼴 변환 속성을 제공합니다. 네 가지 속성 값이 있습니다: none, capitalize(첫 글자가 대문자임), uppercase(모두 대문자), lowercase(모두 소문자).

예: p{font-transform: none;}

8. 텍스트 단락 스타일

가로 정렬

CSS는 가로 정렬을 설정하는 텍스트 정렬 속성을 제공합니다. 속성 값에는 왼쪽(왼쪽 정렬), 오른쪽(오른쪽 정렬), 가운데(가운데 정렬), 양쪽 끝에 정렬(양쪽 정렬)의 네 가지 속성 값이 있습니다.

예: p{text-align: left;}

세로 정렬 CSS는 세로 정렬을 설정하기 위한 쓰기 모드 및 레이아웃 흐름 속성을 제공합니다.

문법: 쓰기 모드: lr-tb;(왼쪽 및 오른쪽 - 위쪽 및 아래쪽)

쓰기 모드: tb-rl(위쪽 및 아래쪽 - 오른쪽 및 왼쪽)

레이아웃 흐름: 가로(가로) 배열)

layout-flow: Vertical-ideographic; (수직 배열)

첫 줄 들여쓰기

CSS는 첫 줄 들여쓰기를 설정하는 text-indent 속성을 제공합니다. 속성 값은 픽셀 값 또는 백분율일 수 있습니다.

예: p{text-indent: 12px;}

줄 간격

CSS는 줄 간격을 설정하는 line-height 속성을 제공합니다. 속성 값은 길이 값일 수 있습니다.

예: p{line-height: 12px;}

문자 간격

CSS는 문자 간격을 설정하는 letter-spacing 속성을 제공합니다. 속성 값은 길이 값일 수 있습니다.

예: p{letter-spacing: 12px;} (문자 간격)

          p{word-spacing: 12px } (단어 간격)

위 내용은 CSS 페이지 레이아웃(텍스트 스타일)에 대한 상식 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!