CSS를 사용하여 글꼴 속성 변경 방법 익히기
글꼴 및 CSS
CSS는 웹 페이지 에서 글꼴 을 조정 하는 가장 효과적인 방법입니다. 폰트 패밀리 , 크기, 색상, 무게, 그리고 타이포그래피의 다른 많은면을 제어 할 수 있습니다.
CSS의 글꼴 속성은 페이지를 더욱 독특하고 독특하게 만드는 가장 일반적인 방법 중 하나입니다. CSS 글꼴 속성 을 사용하여 텍스트의 색상, 크기 및면 (글꼴 자체)을 쉽게 변경할 수 있습니다 .
- 색깔
- 글꼴 모음
- 글꼴 크기
글꼴에는 세 부분이 있습니다.
- 색깔
- 글꼴이 화면에 표시되는 색입니다.
- 크기
- 서체가 화면에 표시되는 크기 또는 크기입니다.
- 얼굴
- 이것은 폰트 패밀리로 실제 폰트라고도합니다.
글꼴 색
텍스트의 색상을 변경하려면 CSS 색상 스타일 속성을 사용하기 만하면됩니다. 색상 이름 또는 16 진 코드를 사용할 수 있습니다. 웹의 모든 색상과 마찬가지로 브라우저 안전 색상 을 사용하는 것이 가장 좋습니다.
웹 페이지에서 다음 스타일을 사용해보십시오.
이 글꼴은 빨간색으로 표시됩니다.
이 글꼴은 파란색으로 표시됩니다.
글꼴 크기
웹에서 글꼴 크기를 설정할 때 상대 크기로 설정하거나 픽셀, 센티미터 또는 인치를 사용하여 매우 구체적인 글꼴 크기를 설정할 수 있습니다. 그러나 더 정확한 글꼴 크기 는 인쇄에 사용하기위한 것이지 웹 페이지를위한 것이 아닙니다. 웹 사이트를 보는 모든 사람들이 다른 해상도, 모니터 크기 또는 기본 글꼴 설정을 가질 수 있습니다. 따라서 표준 크기로 15px를 선택하면 글꼴이 고객에게 얼마나 크고 작게 표시되는지를 알지 못할 수도 있습니다.
글꼴 크기에 em을 사용하는 것이 좋습니다 . Ems는 누가 페이지를 볼 수 있는지에 상관없이 페이지를 계속 액세스 할 수있게하며, em은 화면 렌더링 용입니다. 인쇄 렌더링을위한 픽셀과 포인트는 그대로 둡니다. 글꼴 크기를 변경하려면 웹 페이지에 다음 스타일을 지정하십시오.
이 글꼴은 1em입니다.
이 글꼴은 .75em입니다.
이 글꼴은 1.25em입니다.
글꼴 얼굴
글꼴의 얼굴은 많은 사람들이 "글꼴"을 생각할 때 생각하는 것입니다. 원하는 모든 글꼴을 선언 할 수 있지만 독자가 글꼴을 설치하지 않은 경우 브라우저에서 일치하는 글꼴을 찾으려고합니다. 그것을 위해, 그리고 그들의 페이지는 당신이 의도 한 것처럼 보이지 않을 것입니다.
이 문제를 해결하기 위해 브라우저를 선호 순서대로 사용하기 위해 쉼표로 구분 된 얼굴 이름 목록을 지정할 수 있습니다. 이를 글꼴 스택이라고합니다. Macintosh에서는 표준 글꼴 (예 : Arial)이 표준이 아닐 수 있습니다. 따라서 최소한의 글꼴 만 사용하여 페이지가 디자인 된 것처럼 보이도록 항상 최소로 설치된 컴퓨터 (그리고 두 플랫폼 모두 가능)에서 페이지를 항상 볼 수 있어야합니다.
제가 가장 좋아하는 글꼴 스택 중 하나는이 세트가 산세 리프 글꼴 모음이며 제네바와 arial은별로 닮지 않지만 Macintosh와 Windows 컴퓨터 모두에서 상당히 표준입니다 . 유닉스 나 리눅스와 같은 다른 운영체제의 고객을 위해 helvetica와 helv를 포함합니다.이 라이브러리에는 강력한 글꼴 라이브러리가 없을 수도 있습니다.
이 글꼴은 sans-serif입니다.
이 글꼴은 serif입니다.