@include шрифта лицо SCSS вопрос

При попытке иметь мой SCSS импорт некоторых шрифтов я столкнулся следующее:@include шрифта лицо SCSS вопрос

Я точно скопировали the docs from the compass website, но когда CSS компилируется Compass добавляет случайные числа позади моих src URL. Код SCSS я написал, и в результате CSS выглядит следующим образом

SCSS

@include font-face("NexaBold", font-files("nexa_bold-webfont.woff", "nexa_bold-webfont.ttf", "nexa_bold-webfont.svg", "nexa_bold-webfont.eot"));

причиненный в результате CSS

@font-face { 
    font-family: "NexaBold"; 
    src: url('/fonts/nexa_bold-webfont.woff?1417439024') format('woff'), url('/fonts/nexa_bold-webfont.ttf?1417439024') format('truetype'), url('/fonts/nexa_bold-webfont.svg?1417439024') format('svg'), url('/fonts/nexa_bold-webfont.eot?1417439024') format('embedded-opentype'); 
}

Спасибо!

источник

2014-12-01 Arnold Oosterom

возможный дубликат [Как удалить хэш из созданных Compass созданных имен изображений спрайтов?] (http://stackoverflow.com/questions/9183133/how-to-remove-the-hash-from-compasss-generated-sprite-image-filenames) (добавление случайных чисел в исходные URL-адреса Compass называется «кэширование busting», и он используется для разных источников, а не только для шрифтов.) – hon2a

Случайные числа были добавлены, потому что шрифты браузера кэша основаны на URL-адресе, тогда эти случайные числа вызывают каждый раз, когда вы скомпилируете свои коды и помещаете их в свой html, он снова загружает шрифты.

У меня есть Visual Studio 2013 и скомпилировать код с дерзостью и результат:

@font-face { 
    font-family: "NexaBold"; 
    src: font-files("nexa_bold-webfont.woff", "nexa_bold-webfont.ttf", "nexa_bold-webfont.svg", "nexa_bold-webfont.eot"); }

и вот мой источник компаса для font-face mixin:

@mixin font-face(
    $name, 
    $font-files, 
    $eot: false, 
    $weight: false, 
    $style: false 
) { 
    $iefont: unquote("#{$eot}?#iefix"); 
    @font-face { 
    font-family: quote($name); 
    @if $eot { 
     src: font-url($eot); 
     $font-files: font-url($iefont) unquote("format('eot')"), $font-files; 
    } 
    src: $font-files; 
    @if $weight { 
     font-weight: $weight; 
    } 
    @if $style { 
     font-style: $style; 
    } 
    } 
}

если вы посмотрите мой компас версию Безразлично Не добавляйте случайное число в конец пути к файлу.

я сам предлагаю вам использовать font-face без компаса, используйте код ниже:

@font-face { 
    font-family: 'IranSans'; 
    src: url('/css/fonts/IranSans.eot'); /* IE9 Compat Modes */ 
    src: url('/css/fonts/IranSans.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
    url('/css/fonts/IranSans.woff') format('woff'), /* Modern Browsers */ 
    url('/css/fonts/IranSans.ttf') format('truetype'), /* Safari, Android, iOS */ 
    url('/css/fonts/IranSans.svg') format('svg'); /* Legacy iOS */ 
}

источник

2014-12-01 21:28:13

Просто добавьте эту строку в config.rb:

asset_cache_buster :none

источник

2015-06-02 20:52:15 nikopiko

@include шрифта лицо SCSS вопрос

ответ

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