не могу заставить @ font-face работать правильно - PullRequest
Новая
       15

не могу заставить @ font-face работать правильно

0 голосов
/ 12 марта 2011

Я скачал набор шрифтов из squirrel font и создал файл css с заданным кодом. Я скопировал все файлы woff, ttf, eot и svg в свою общую папку и создал код h1, который ссылается на шрифт, который я хочу использовать. Однако, когда я проверяю, работает ли шрифт, я просто получаю новый римский стандарт. Если я добавлю резервный шрифт рядом с тем, который хочу использовать, я получу этот шрифт. Кто-нибудь знает, почему это может происходить? Вот код, который я использую. 

@font-face {
font-family: 'CartoGothicStdBook';
src: url('CartoGothicStd-Book-webfont.eot');
src: url('CartoGothicStd-Book-webfont.eot?iefix') format('eot'),
     url('CartoGothicStd-Book-webfont.woff') format('woff'),
     url('CartoGothicStd-Book-webfont.ttf') format('truetype'),
     url('CartoGothicStd-Book-webfont.svg#webfont1l1oLWSU') format('svg');
font-weight: normal;
font-style: normal;

}
.carto {
font-family: CartoGothicStdBook, Arial;
color: #333333;
font-size: 44px;
letter-spacing: -3px;
}

<h1 class= "carto"><b>Share Your Knowledge & Explore Your Passions<b></h1>

Ответы [ 2 ]

0 голосов
/ 22 сентября 2011

Ответ указан выше, и это была простая проблема с каталогом.Rails требует ведущего / для добавленной директории.

0 голосов
/ 13 марта 2011

импортируете ли вы эти шрифты из внешней таблицы стилей? Когда я поместил свои шрифты в ту же директорию и вставил объявления @ font-face непосредственно в мои страницы, где это было применимо, у меня не было проблем, но, похоже, я не мог ссылаться на относительный источник. Мне интересно, имеет ли это какое-то отношение ко всей суете по поводу лицензирования. Другое дело ... Мне, кажется, повезло, ссылаясь на шрифты с помощью '', например ::1001* 

    ul li:nth-child(6n),#filler {
    color:#3F9;
    font-family:'WCRhesusABtaRegular';
    }

где соответствующий шрифт будет: 

        @font-face {
            font-family: 'WCRhesusABtaRegular';
            src: url('WC_Rhesus_A_Bta-webfont.eot');
            src: url('WC_Rhesus_A_Bta-webfont.eot?iefix') format('eot'),
                 url('WC_Rhesus_A_Bta-webfont.woff') format('woff'),
                 url('WC_Rhesus_A_Bta-webfont.ttf') format('truetype'),
                 url('WC_Rhesus_A_Bta-webfont.svg#webfonte627I3xy') format('svg');
            font-weight: normal;
            font-style: normal;

        }

Кстати, это потрясающий шрифт для декоративных целей (если вы хотите использовать Джексона Поллака по всему сайту), не так много для чтения :)

надеюсь, что это поможет, если у вас возникнут какие-либо проблемы ... если вы нашли способ импортировать таблицы стилей шрифтов или поместить шрифты в отдельный каталог, я, конечно, хотел бы услышать об этом ... У меня нет Я не смог найти в Интернете примеров, когда кто-нибудь импортирует шрифты ... но я видел, как люди использовали каталог / Fonts. Это также может быть предмет, связанный с лицензированием?

Да, и короткая заметка для тех из вас, кто только начинает работать с @ font-face (я только начинаю сам) ... Есть пара "недочетов", о которых упоминает Пол Ирриш, но вы должны убедитесь, что шрифты не установлены локально, так как ваш браузер будет использовать ваши локальные шрифты, если они доступны - это делает ваше тестирование ненадежным ... конечно, не так уж сложно удалить шрифты (по крайней мере, в Windows 7).

Вот еще немного информации от Пола Айриша:

http://paulirish.com/2010/font-face-gotchas/#comment-48744

...