CSS의 일반적인 글꼴 군은 무엇입니까?

웹 사이트에서 사용할 수있는 일반적인 글꼴 분류

웹 사이트를 디자인 할 때 작업 할 페이지의 핵심 요소 중 하나는 텍스트 콘텐츠입니다. 따라서 CSS를 사용하여 웹 페이지를 만들고 스타일을 지정할 때 사이트 디자인에 중점을 둘 것입니다.

인쇄상의 디자인은 웹 사이트 디자인에서 중요한 역할을합니다. 잘 배치되고 형식화 된 텍스트 컨텐츠는 즐겁고 쉽게 소비 할 수있는 독서 환경을 만들어 사이트가 더 성공적으로 운영되도록합니다. 유형 작업에 대한 귀하의 노력 중 일부는 디자인에 적합한 글꼴을 선택한 다음 CSS를 사용하여 해당 글꼴 및 글꼴 스타일을 페이지 디스플레이에 추가하는 것입니다. 이것은 " 폰트 스택 (font-stack) "이라고 불리는 것을 사용함으로써 이루어진다.

글꼴 스택

웹 페이지에서 사용할 글꼴지정할 때 글꼴 선택을 찾을 수없는 경우를 대비하여 대체 옵션을 포함하는 것이 가장 좋습니다. 이러한 폴백 옵션은 "글꼴 스택"에 표시됩니다. 브라우저가 스택에 나열된 첫 번째 글꼴을 찾지 못하면 다음 글꼴로 이동합니다. 이 프로세스는 사용 가능한 글꼴을 찾을 때까지 계속되거나 선택 항목이 부족할 때까지 계속 진행됩니다 (이 경우 시스템 글꼴을 선택하기 만하면됩니다). 다음은 "body"요소에 적용 할 때 CSS에서 글꼴 스택이 어떻게 표시되는지 보여주는 예입니다.

body {font-family : 조지아, "Times New Roman", serif; }

조지아 글꼴을 먼저 지정합니다. 기본적으로 이것은 페이지에서 사용되지만, 어떤 이유로 든 해당 글꼴을 사용할 수없는 경우 페이지는 Times New Roman으로 폴백됩니다. 이 글꼴 이름은 여러 단어로 된 이름이므로 큰 따옴표로 묶습니다. 조지아 또는 Arial과 같은 단일 단어 글꼴 이름에는 따옴표가 필요하지 않지만 여러 단어 글꼴 이름이 필요하므로 브라우저는 모든 단어가 글꼴 이름을 구성한다는 것을 알고 있습니다.

글꼴 스택의 끝을 보면 "serif"라는 단어로 끝나는 것을 볼 수 있습니다. 이것은 일반적인 글꼴 패밀리 이름입니다. 드문 일이지만 사람이 조지아 또는 타임즈 뉴로만을 자신의 컴퓨터에 갖고 있지 않은 경우 사이트는 발견 할 수있는 모든 서체 글꼴을 사용합니다. 이렇게하면 사이트에서 원하는 글꼴을 사용하도록 허용하는 것이 바람직합니다. 왜냐하면 최소한 사이트 디자인의 전반적인 모양과 색조가 그대로 유지되도록 사용할 글꼴의 종류를 알 수 있기 때문입니다. 네, 브라우저가 당신을 위해 글꼴을 선택할 것입니다,하지만 적어도 당신이 어떤 종류의 글꼴이 디자인 내에서 가장 잘 작동하는지 알 수 있도록 지침을 제공하고 있습니다.

일반 글꼴 모음

CSS에서 사용할 수있는 일반적인 글꼴 이름은 다음과 같습니다.

slab-serif, blackletter, display, grunge 등을 비롯한 웹 디자인 및 활판 인쇄에는 다른 글꼴 분류가 많이 있지만 위에 나열된 5 가지 일반 글꼴 이름은 CSS의 글꼴 스택에서 사용할 글꼴 이름입니다. 이러한 글꼴 분류의 차이점은 무엇입니까? 한 번 보자!

필기체 글꼴에는 종종 손으로 쓴 멋진 텍스트를 복제하는 얇고 화려한 문자 모양이 있습니다. 이 글꼴은 얇고 꽃이 많은 문자로 인해 본문 복사와 같은 큰 블록 내용에는 적합하지 않습니다. 필기체 글꼴은 일반적으로 큰 글꼴 크기로 표시 할 수있는 머리글과 짧은 텍스트 필요성에 사용됩니다.

판타지 글꼴은 실제로 다른 범주에 속하지 않는 다소 미친 글꼴입니다. Harry Potter 또는 Back to the Future 영화의 글자 모양과 같이 잘 알려진 로고를 복제하는 글꼴은이 범주에 속합니다. 다시 한번 말하지만,이 글꼴은 본문 내용에 적합하지 않습니다. 글꼴이 너무 길기 때문에이 글꼴로 작성된 텍스트를 더 오랫동안 읽는 것이 너무 어렵 기 때문입니다.

모노 스페이스 글꼴은 오래된 타자기에서 찾은 것처럼 모든 문자 양식의 크기와 간격이 동일한 글꼴입니다. 크기에 따라 글자의 폭이 가변적 인 다른 글꼴과 달리 (예 : 대문자 "W"는 소문자 "i"보다 훨씬 많은 공간을 차지합니다) 모노 스페이스 글꼴은 모든 문자에 대해 고정 폭입니다. 이러한 글꼴은 해당 페이지의 다른 텍스트와 분명히 다르기 때문에 코드가 페이지에 표시 될 때 자주 사용됩니다.

Serif 글꼴은 가장 인기있는 분류 중 하나입니다. 이들은 문자 양식에 약간의 합자가있는 글꼴입니다. 그 여분의 조각들은 "serifs"라고 불린다. 일반적인 serif 글꼴은 조지아와 Times New Roman입니다. Serif 글꼴은 제목과 같은 큰 텍스트는 물론 텍스트와 본문의 긴 구절에도 사용할 수 있습니다.

Sans-serif 는 우리가 볼 최종 분류입니다. 이들은 앞서 언급 한 합자가없는 글꼴입니다. 이름은 "serifs없이"의미합니다. 이 카테고리의 인기 글꼴은 Arial 또는 Helvetica입니다. serif와 마찬가지로 sans-serif 글꼴은 제목뿐만 아니라 본문 내용에서도 똑같이 사용할 수 있습니다.

Jennifer Krynin의 원본 기사입니다. Jeremy Girard에 의해 10/16/17에 편집 됨