Отладка Google Web Fonts - PullRequest
       4

Отладка Google Web Fonts

2 голосов
/ 15 июля 2010

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

<html>
    <head>
        <script src="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:extralight,light,regular,bold"></script>
        <style>
        h1, h2, h3 { font-family: "Yanone Kaffeesatz"; color: red } 
        </style>
    </head>
    <body>
        <h1>This is some text</h1>
    </body>
</html>

Ответы [ 5 ]

4 голосов
/ 15 июля 2010

Вы должны включить шрифт, используя тег <link>.

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:extralight,light,regular,bold">

2 голосов
/ 07 июня 2012

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

family=Arapey:italic

, вам нужно использовать CSS, например,

font-family: 'Arapey';
font-style:italic;

, если вы пропустите

font-style:italic;

, тогда шрифтне будет загружаться в Chrome (и, возможно, другие браузеры?).Хотя в Firefox это будет работать без него.

2 голосов
/ 15 июля 2010

Согласно странице Google Webfont правильная запись:

<link href=' http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:extralight,light,regular,bold' rel='stylesheet' type='text/css'>
1 голос
/ 15 июля 2010

Вы установили файл CSS как файл сценария по ошибке.

<script src="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:extralight,light,regular,bold"></script>

Должно быть

<link href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz" rel="stylesheet" type="text/css">
0 голосов
/ 07 января 2011

Вы также можете поместить это в свой файл .css

@ url для импорта ("http://fonts.googleapis.com/css?family=Just+Me+Again+Down+Here");

вы не будете загромождать ваш HTML всеми этими глупыми тегами ссылок. Google показывает это в разделе «Дополнительно».

Остерегайтесь, если вы используете LESSCSS, потому что @ определяет переменную. дайте мне знать, если есть способ избежать этого - я не смог его найти!

...