Подтвердить что ты не робот

Как узнать, какой шрифт Chrome использует?

Представьте, что у меня есть следующий CSS

font-family: 'Non-existant Sans', Arial, sans-serif;

Предполагая, что в системе не установлен "Несуществующий Sans", Arial будет использоваться браузером. Используя Chrome, есть ли способ узнать, какой шрифт отображается?

Изменить: Дэйв (в комментариях к вопросу) указал на аналогичный вопрос. Я специально спрашиваю о Chrome здесь. Многие ответы в другом вопросе предполагают расширения, которые в порядке; есть ли собственный способ определения этой информации с помощью только Dev Tools?

Изменить сентябрь 2013: Команда Chrome только что анонсировала, что проверка семейства шрифтов теперь доступна в последних версиях Chrome Canary ( Ссылка Twitter содержит изображение с дополнительной информацией). Это должно просочиться через dev > beta > стабильный в течение следующих нескольких недель - отличные новости!

4b9b3361

Ответ 1

В Google Chrome devtools на вкладке "Элементы" в разделе "Вычислить":

Magic paper roses hello kitty

Ответ 2

Я немного опаздываю на вечеринку, но я только что открыл очень простой способ отладки того шрифта, который использует ваш браузер.

В Chrome Web Inspector перейдите в стек шрифтов в панели CSS панели Elements. Затем, начиная с вершины стека, измените имя шрифта (я добавляю случайные буквы), одновременно следя за текстом. Когда вы меняете используемую вами, вы увидите шрифт для изменения текста, когда он возвращается к следующему в стеке.

Я предполагаю, что что-то подобное возможно в большинстве инструментов dev

Вуаля

Ответ 3

Если вы не хотите использовать плагин, есть букмарклет, который вам скажет (после активации и наведите курсор на указанный текст):

http://chengyinliu.com/whatfont.html

Ответ 4

Ваш "Non-existant Sans" может быть визуализирован с помощью @font-face в вашем css. http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

Я не знаю способа определения рендеринга шрифтов, поэтому я не отвечаю на ваш вопрос технически. Я нашел это: http://webdesignerwall.com/tutorials/css3-font-face-design-guide это javascript под названием Modernizr, который гарантирует, что браузер не поддерживает @font-face, тогда он будет загружать резервные шрифты, такие как Arial и Helvetica.