2012-04-04 2 views
2

@ font-face - это путаница, так как все браузеры не могут решить использовать один формат файла. Ниже я использую для добавления 1 нового шрифта на сайт, вы можете видеть, что есть 4 отдельных файла шрифтов, я знаю, что каждый из них связан с тем, что некоторые браузеры поддерживают разные форматы, но браузер загружает все файлы или только 1 что ему нужно?Какие шрифты загружаются браузерами при использовании шрифта @ font-face

@font-face { 
    font-family: 'Oswald'; 
    src: url('oswald-webfont.eot'); 
    src: url('oswald-webfont.eot?#iefix') format('embedded-opentype'), 
     url('oswald-webfont.woff') format('woff'), 
     url('oswald-webfont.ttf') format('truetype'), 
     url('oswald-webfont.svg#OswaldRegular') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

} 
+0

Вы всегда можете посмотреть журналы доступа вашего сервера и посмотреть, что скачал браузер DID, или использовать веб-интерфейс, такой как HTTPFox или вкладка NetBoard Firebug, если вы находитесь в Firefox. –

+0

Google Chrome также есть, что посмотреть, что вы вниз или нет. –

+1

Я считаю, что он загружает первый совместимый формат для браузера. Все после этого игнорируется. – Scott

ответ

1

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

Мое ожидание, похоже, ошибочно. На сайте, который встроил шрифты с разметкой, идентичными тому, что вы указали выше, FF загрузил только файл .woff, даже если он поддерживает .ttf/.otf.

FYI, the support matrix; отдельные форматы связаны снизу.

Смежные вопросы