css는 글꼴 속성을 변경합니다: 글꼴, 글꼴 계열, 글꼴 크기, 글꼴 스타일, 글꼴 변형, 글꼴 무게, "@font-face", 글꼴 크기 조정, 글꼴 스트레치 등.
이 튜토리얼의 운영 환경: Windows 7 시스템, CSS3 버전, Dell G3 컴퓨터.
css 글꼴 속성 변경
property | description |
---|---|
font | 모든 글꼴 속성을 하나의 명령문으로 설정 |
font-family | s tipulations 텍스트용 글꼴 모음 |
font-size | 텍스트의 글꼴 크기를 지정합니다 |
font-style | 텍스트의 글꼴 스타일을 지정합니다 |
font-variant | 텍스트의 글꼴 스타일을 지정합니다 |
font -weight | 글꼴의 두께를 지정합니다. |
@font-face | 웹 사이트에서 "웹 안전" 글꼴 이외의 다른 글꼴을 다운로드하고 사용할 수 있도록 허용하는 규칙 |
font-size-adjust | 을 지정합니다. 요소의 측면 값 |
font-stretch | 현재 글꼴 모음 축소 또는 늘이기 |
color | 글꼴 텍스트 색상 설정 |
글꼴 스타일 속성:
글꼴 스타일 속성은 텍스트의 글꼴 스타일을 지정합니다.
값 | 설명 |
---|---|
normal | 기본값입니다. 브라우저는 표준 글꼴 스타일을 표시합니다. |
italic | 브라우저는 기울임꼴 글꼴 스타일을 표시합니다. |
oblique | 브라우저에 기울어진 글꼴 스타일이 표시됩니다. |
font-variant 속성:
font-variant 속성은 텍스트를 작은 대문자로 표시하기 위한 글꼴을 설정합니다. 즉, 모든 소문자는 대문자로 변환되지만 작은 대문자 글꼴을 사용하는 모든 문자는 대문자로 변환됩니다. 글꼴 크기가 나머지 텍스트보다 작습니다.
값 | 설명 |
---|---|
normal | 기본값입니다. 브라우저는 표준 글꼴을 표시합니다. |
small-caps | 브라우저는 작은 대문자 글꼴을 표시합니다. |
font-weight 속성:
font-weight 속성은 텍스트의 가중치
값 | 설명 |
---|---|
normal | 기본값을 설정합니다. 표준 문자를 정의합니다. |
bold | 굵은 문자를 정의하세요. |
bolder | 더 굵은 문자를 정의하세요. |
lighter | 는 더 미세한 문자를 정의합니다. |
|
얇은 것부터 두꺼운 것까지 문자를 정의하세요. 400은 Normal에 해당하고, 700은 Bold에 해당합니다. |
color 속성:
Color 속성은 텍스트의 색상을 지정합니다.
Value | Description |
---|---|
색상 이름 | 빨간색, 파란색, 갈색, 연한 녹색 등과 같은 색상 이름은 대소문자를 구분하지 않습니다. |
HEX | 16진수 기호 #RRGGBB 및 #RGB(예: #ff0000). "#" 뒤에 6~3개의 16진수 문자(0-9, A-F)가 옵니다. |
RGB, red-green-blue (RGB) | 는 색상 값이 rgb 코드의 색상이고 함수 형식은 rgb(R,G,B)이며 값은 An이 될 수 있음을 지정합니다. 0~255 사이의 정수 또는 백분율입니다. |
RGBA, Red-Green-Blue-Alpha(RGBa) | RGBa는 RGB 색상 모드를 확장하여 알파 채널을 포함하므로 색상의 투명도를 설정할 수 있습니다. a는 투명도를 나타냅니다. 0=투명, 1=불투명. |
HSL,hue-saturation-lightness(Hue-saturation-lightness) | Hue(Hue)는 색상환(즉, 무지개를 나타내는 고리)의 각도를 나타냅니다. 채도와 명도는 백분율로 표시됩니다. 100%는 완전 채도이고 0%는 회색조입니다. 밝기 100%는 흰색, 밝기 0%는 검은색, 밝기 50%는 "보통"입니다. |
HSLA, Hue-Saturation-Lightness-Alpha(HSLa) | HSLa는 HSL 색상 모드에서 확장되며 색상의 투명도를 지정할 수 있는 알파 채널을 포함합니다. a는 투명도를 나타냅니다. 0=투명, 1=불투명. |
(학습 영상 공유: css 영상 튜토리얼)
위 내용은 글꼴을 변경하는 CSS의 속성은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!