2013-10-04 5 views
2

У меня есть каталог с именем project и в нем у меня есть каталоги html, assets и javascript .the активы directory имеют каталоги fonts и css .the css каталога содержит файл под названием CSS typography.css. В каталоге fonts есть все шрифты, которые я использую.@fontface путь CSS шрифт не похож на работу

Внутри каталога html У меня есть файл typography.html. Для того, чтобы использовать шрифты, которые я использую этот код в typography.css который правильно связан/ссылке в моем HTML file.However этого кода внутри typography.css

@font-face { 
    font-family: "LatoLight"; 
    src: url('../fonts/lato-light-webfont.eot') format("embedded-opentype"), url('../fonts/lato-light-webfont.woff') format("woff"), url('../fonts/lato-light-webfont.ttf') format("truetype"), url('../fonts/lato-light-webfont.svg') format("svg"); 
    } 
    h1{ font-family: LatoLight !important; } 

не дают желаемые result.I я использую Twitter Bootstrap 3.Why является это не работает ?.

+0

Вы пытались помещать файлы шрифтов непосредственно в папку css и связывать их там, чтобы узнать, есть ли какие-либо другие проблемы, кроме проблемы с каталогом? –

+0

Да, я тоже это сделал, и это тоже не срабатывает. Однако, когда я использую встроенный стиль внутри моего файла typography.html и напрямую добавляю все шрифты внутри html, он работает, но мне нужны шрифты, которые будут в каталоге шрифтов. –

+0

какой браузер вы используете? –

ответ

3

Try:

@font-face { 
    font-family: 'LatoLight'; 
    src: url('../fonts/lato-light-webfont.eot') format("embedded-opentype"), 
     url('../fonts/lato-light-webfont.woff') format("woff"), 
     url('../fonts/lato-light-webfont.ttf') format("truetype"), 
     url('../fonts/lato-light-webfont.svg') format("svg"); 
    font-weight: normal; 
    font-style: normal; 
} 

я переключился двойные кавычки одного. Это МОЖЕТ иметь значение, но я не уверен.

В противном случае это может помочь Bootstrap 3 unable to display glyphicon properly Я знаю, что это глификоны, но firefox может иметь проблемы с другими шрифтами.

+1

Проблема была в том, что проблема с политикой происхождения файла обсуждалась здесь http://stackoverflow.com/a/19068467/2420583 в вопросе, который вы связали. После установки этого свойства 'security.fileuri.strict_origin_policy' в false теперь оно работает. –

+0

Отлично, рад, что вы его отсортировали :) –

+1

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

0

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

h1{ font-family: "LatoLight" !important; } 
+0

Это тоже не работает. Я пробовал это раньше. –

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