2015-07-29 4 views
3

Я пытаюсь использовать шрифт Google Muli на моем сайте. я вижу, что шрифт отлично работает в хроме, FF и опере.Google шрифт не работает в IE11

Когда я открываю свой веб-сайт в IE9,10,11, его вовсе не берут шрифт. Я пробовал следующие методы, но все равно не повезло.

Метод 1:

<script type="text/javascript"> 
WebFontConfig = { 
google: { families: [ 'Muli::latin' ] } 
}; 
(function() { 
var wf = document.createElement('script'); 
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') + 
    '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js'; 
wf.type = 'text/javascript'; 
wf.async = 'true'; 
var s = document.getElementsByTagName('script')[0]; 
s.parentNode.insertBefore(wf, s); 
})(); </script> 

Метод 2:

<link href='http://fonts.googleapis.com/css?family=Muli' rel='stylesheet' type='text/css'> 

Метод 3:

@import url(http://fonts.googleapis.com/css?family=Muli); 

я нашел что-то шокирующее есть, IE совсем не загружается http://fonts.googleapis.com/css?family=Muli url. Я попытался загрузить тот же url в новом окне, и его не отвечает, но он работает в других браузерах.

Есть ли что-нибудь, что мне нужно включить для работы в IE?

+0

Проверьте консоль IE. Есть ли ошибки? Метод 2 должен работать в IE11. –

ответ

0

Способ 3, работающий для меня отлично! Проверьте это на JSFiddle.

HTML

<h1>Hello world!</h1> 

CSS

@import url(http://fonts.googleapis.com/css?family=Muli); 

h1 { 
    font-family: 'Muli', sans-serif; 
} 
2

Вы тестирование локально или на живом сайте? IE имеет проблемы с веб-шрифтами по HTTPS (это может быть вашей проблемой).

+0

Спасибо! это спасло мое время. FYI, это связано с заголовком 'Pragma' – Kunal

2

OK - Будет ли OP проверять и проверять, является ли сайт локальным сайтом «интранет», например локальный компьютер или ближайший компьютер в локальной сети. Если это так, откройте «Настройки совместимости» и снимите флажок внизу, в котором говорится, чтобы все сайты интрасети отображались в режиме совместимости.

Просмотр совместимости заставляет его отправлять строку User Agent MSIE 7.0 не только на веб-сервер, но и на ресурсы, которые сервер загружает. Это означает, что Google видит пользовательский агент MSIE 7.0 и предполагает, что вы хотите использовать шрифты EOT, а не формат WOFF. Вот почему Google получает вину за отправку различных вещей в IE. IE лжет и говорит, что он древний. Когда вы отключите этот флажок, Google увидит новую строку User Agent, и она будет работать!

Также представляется, что для получения достойного механизма рендеринга вам нужны как начальные, так и минимальные значения, установленные в метатеге. По крайней мере, это, по-видимому, было изменением, что фиксированная компоновка для меня (ранее я использовал только начальную шкалу)

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0"> 
+0

. Уверяю вас, я исправлю это. Я загрузил .woff и .woff2 шрифты из Google и поместил их на свой собственный сервер, и это устранило проблему. благодаря – AymKdn

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