Функция @ font-face не работает - PullRequest
Новая
       22

Функция @ font-face не работает

0 голосов
/ 19 декабря 2010

Не получается заставить это работать в любом браузере, кто-нибудь знает, что я делаю не так?

Работает здесь: http://daveywhitney.com/ford/one/

@font-face {
    font-family: 'SackersItalianScriptStdRegula';
    src: url('font/sackersitalianscriptstd-webfont.eot');
    src: url('font/sackersitalianscriptstd-webfont.woff') format('woff'), url('font/sackersitalianscriptstd-webfont.ttf') format('truetype'), url('font/sackersitalianscriptstd-webfont.svg#webfontkWmYBTH2') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'EngraversMTRegular';
    src: url('font/engr-webfont.eot');
    src: url('font/engr-webfont.woff') format('woff'), url('font/engr-webfont.ttf') format('truetype'), url('font/engr-webfont.svg#webfontQUS0Zswo') format('svg');
    font-weight: normal;
    font-style: normal;
}    

#sidetop {
    width:90px;
    height:50px;
    font-size: 12px;
    font-family:EngraversMTRegular;
}

#sidetop ul li {
    float:right;
    margin:0 0 10px 0;
    font-family:EngraversMTRegular;
}

#names {
    width:150px;
    height:250px;
    float:right;
    overflow-y: scroll;
    font-size:30px;
    font-family:SackersItalianScriptStdRegula;
    color:#858484;
    margin:0 0 0 50px;
    font-weight:normal;
}

Ответы [ 2 ]

1 голос
/ 19 декабря 2010

Ваши пути к файлам шрифтов не те, что вы опубликовали здесь.В файлах CSS ваши URL выглядят так: url('/font/engr-webfont.eot').Это означает, что ваш шрифт будет жить на http://daveywhitney.com/font/engr-webfont.eot.Начальная косая черта делает URL-адрес относительно корня сервера, а не таблицы стилей.Вместо того, чтобы заставлять нас догадываться, возможно, вы могли бы рассказать нам, как выглядит ваша структура каталогов - где расположены шрифты относительно файла css.

1 голос
/ 19 декабря 2010

URL-адреса неверны. Например, я не получаю файл шрифта здесь: 

http://daveywhitney.com/ford/one/css/font/engr-webfont.woff
...