Как да открием фамилните имена на шрифтовете за CSS

Имената на шрифтовите семейства се използват в каскадните стилове (CSS) за идентифициране на шрифт. Тъй като много шрифтове имат различни варианти (например Arial Black, Verdana Bold), в CSS се посочва семейното име – Arial, Helvetica или Verdana – което обхваща всички тези варианти. Съществуват и генерични семейства като sans‑serif и monospace, които позволяват на браузъра да избере подходящ шрифт, ако конкретният не е наличен.

Стъпка 1

Отворете папката Fonts във вашата система (на Windows натиснете „Start“, напишете „fonts“ и натиснете Enter). Намерете желания шрифт и запишете неговото име. Например, шрифтът Arial има множество вариации, но всички те споделят семейното име „Arial“. За общо използване задайте font-family: Arial;, а за конкретна вариация – font-family: "Arial Narrow";. Обикновено се препоръчва да се използва генерично семейство за основния текст, а по‑специфични шрифтове за заглавията.

Стъпка 2

Създайте шрифтов стек – списък от фамилни имена, който служи като резервен план, ако предпочитаният шрифт липсва. Завършете стека с генерично име: serif за семейства като Georgia или Times New Roman, sans-serif за Helvetica, Verdana и др., както и monospace, cursive и fantasy. Забележка: генеричните имена нямат значение, когато шрифтът се вгради чрез @font-face.

Ако фамилното име съдържа повече от една дума, го оградете с кавички – единични или двойни. Пример:

body { font-family: "Helvetica Neue", Arial, sans-serif; }

Този стек казва: първо се търси Helvetica Neue. Ако липсва, Windows‑потребителите ще получат Arial, а останалите – стандартен sans‑serif според настройките на браузъра.

Съвет

• Някои известни дизайнери (например Paul Irish и Chris Coyier) препоръчват да се избягват дълги шрифтови стекове и да се остават само с генерично семейство (напр. font-family: sans-serif;). Това уважава потребителските настройки и спестява време, тъй като повечето браузъри вече избират подходящ шрифт.