Есть несколько способов сделать это. На самом деле я делаю это довольно много, потому что мне очень интересно, как работает CSS, а также я просто люблю типографику. Мне нравится это делать двумя способами:
Как интерпретировать font-familyCSS:
font-familyСвойство определяет , какие шрифты. В этом свойстве шрифты будут разделяться запятыми . При отображении страницы браузер просматривает этот список и использует первый шрифт, который находится на компьютере . Во многих случаях есть также категория шрифта в конце этого свойства, которая является просто «на всякий случай», так что шрифт по умолчанию для этой категории используется, если другие недоступны.
Пример: допустим, это некий css для <p>вложения.
p.thisisasampleclass
{
font-family: Calibri, "Comic Sans MS", Georgia, sans-serif;
}
Здесь браузер сначала попытается использовать Calibri, если шрифт доступен. Если нет, он использует Comic Sans MS или Georgia, или просто шрифт без засечек по умолчанию, если другие недоступны.
Вот как вы можете узнать, какие шрифты используются. Я не нашел хороших и полезных инструментов, которые бы очень хорошо визуализировали CSS, но я думаю, что опция Inspector подойдет вам (это не слишком запутанно!). Я думаю, что это путь.
Пример того, как найти шрифты NYTimes с помощью инструмента «Инспектор»:
Я собираюсь рассказать вам, как найти шрифты для основного текста статьи в NYTimes с помощью Google Chrome.
Перейдите к статье на NYTimes.com, щелкните правой кнопкой мыши на текстовом элементе, для которого вы хотите найти шрифты, и нажмите « Проверить элемент» .
Посмотрите на боковую панель справа. В раскрывающемся списке « Вычисляемый стиль» вы увидите свойства CSS для этого элемента. Однако, как вы можете видеть, в настоящее время здесь нет свойства font-family, что означает, что шрифты определены глобально, а не только для этого конкретного элемента. Тем не менее, есть способ обойти это!
Это то, что вы делаете: выберите переключатель рядом с «Показать унаследованные».
Многие другие глобальные свойства появятся в разделе «Computed Style».
Прокрутите список вниз до «font-family». Он должен быть серым, что означает, что это унаследованное глобальное свойство. Здесь вы можете увидеть используемые шрифты! Та-да!
