Синтаксисът на фамилията собственост на шрифта
Типографският дизайн е критично важна част от успешния дизайн на уебсайта. Създаването на сайтове с текст, който е лесен за четене и който изглежда страхотно е целта на всеки професионален уеб дизайн. За да постигнете това, ще трябва да сте в състояние да зададете конкретните шрифтове, които искате да използвате на уеб страниците си. За да укажете фамилията на шрифта или семейството на шрифтове във вашите уеб документи, ще използвате характеристиката стил на семейство шрифт във вашия CSS.
Най-простият стил шрифт-семейство, който можете да използвате, ще включва само едно семейство шрифтове:
p {шрифт-семейство: Arial; }Ако сте приложили този стил на страница, всички параграфи ще се показват в семейството от шрифтове "Arial". Това е страхотно и тъй като "Arial" е това, което е известно като "уеб-сигурен шрифт", което означава, че повечето (ако не всички) компютри ще го инсталират, можете да останете доста лесно, знаейки, че страницата ви ще се показва в предвидения шрифт ,
Какво се случва, ако избраният шрифт не може да бъде намерен? Ако например не използвате "уеб-безопасен шрифт" на страница, какво прави потребителският агент, ако няма такъв шрифт? Те заместват.
Това може да доведе до някои много забавни изглежда страници. Веднъж отидох на страница, на която компютърът ми го показал изцяло в "Wingdings" (икона-набор), защото компютърът ми не разполагаше с шрифта, който разработчикът определи, а моят браузър направи много лош избор в какъв шрифт би употреба като заместител. Страницата беше напълно нечетлива за мен! Това е мястото, където се вкарва стак на шрифтове.
Разделете множество семейства от шрифтове с кома в купчин на шрифтове
"Стик на шрифтове" е списък с шрифтове, които искате вашата страница да използва. Вие бихте поставили вашия избор на шрифтове по реда на Вашите предпочитания и ще ги разделите със запетая. Ако браузърът няма първото семейство от шрифтове в списъка, ще се опита втората, а след това и третата и така нататък, докато не открие такъв, който има в системата.
шрифт-семейство: Pussycat, Алжир, Бродуей;В горния пример браузърът първо ще търси шрифта "Pussycat", след това "Алжир", а след това "Бродуей", ако никой от другите шрифтове не бъде намерен. Това ви дава повече шанс, че поне един от избраните от вас шрифтове ще бъде използван. Това не е перфектно, затова имаме още повече, които можем да добавим към нашата палитра (прочетете нататък!).
Използвайте генерични шрифтове последно
Така че можете да създадете стека на шрифтове със списък от шрифтове и все още да нямате нищо, което да може да намери браузърът. Очевидно не искате страницата ви да се показва нечетлива, ако браузърът направи лош избор за замяна. За щастие CSS има решение и за това: общи шрифтове .
Винаги трябва да завършвате списъка си с шрифтове (дори ако това е списък на едно семейство или само шрифтове в мрежата) с общ шрифт. Има пет, които можете да използвате:
- курсив
- фантазия
- едноразряден
- безсерифни
- извивка на буква
Двата горни примера могат да бъдат променени на:
шрифт-семейство: Arial, sans-serif; шрифт-семейство: Pussycat, Алжир, Бродуей, фантазия;Някои имена на семейство шрифтове са две или повече думи
Ако семейството шрифтове, което искате да използвате, е повече от една дума, тогава трябва да го заобиколите с двойни цитати. Докато някои браузъри могат да четат семейства шрифтове без кавичките, може да има проблеми, ако бялото пространство е кондензирано или игнорирано.
шрифт-семейство: "Times New Roman", сериф;В този пример можете да видите, че шрифтът "Times New Roman", който е многословен, е обвит в кавички. Това казва на браузъра, че всичките три от тези думи са част от това име на шрифта, за разлика от три различни шрифта, всички с еднобуквени имена.
Оригинална статия на Дженифър Кринин. Редактирано на 12/2/16 от Джереми Жирар