Шрифты CSS: Как конвертировать несколько файлов TTF в один файл? - PullRequest
2 голосов
/ 28 марта 2012

Я получил несколько файлов шрифтов TTF. Необходимо конвертировать в 1 файл, который я могу использовать в CSS.

Как я могу это сделать?

Спасибо

Ответы [ 3 ]

3 голосов
/ 28 марта 2012

Вы не можете сделать это, каждый шрифт нуждается в своем отдельном файле.Вы можете использовать сервис для преобразования ttf в eot и svg-файлов, а затем использовать такой код в вашем файле style.css (если это имя вашей таблицы стилей):

@font-face {
    font-family: 'FuturaM';
    src: url('fonts/FuturaMedium.eot');
    src: url('fonts/FuturaMedium.eot?#iefix') format('embedded-opentype'),
         url('fonts/FuturaMedium.ttf') format('truetype'),
         url('fonts/FuturaMedium.svg#FuturaMedium') format('svg');
}

Надеюсь, это поможет!

1 голос
/ 28 марта 2012

Каждый файл TTF состоит из различных стилей шрифта, которые обычно являются обычными, полужирным и курсивом.Каждый файл TTF связан с уникальным стилем шрифта.
Таким образом, невозможно объединить разные файлы TTF, даже если они принадлежат одному шрифту.Вы не можете объединить яблоко, апельсин и манго только потому, что они все фрукты, верно?(неудачный пример, извините)

0 голосов
/ 14 апреля 2014

Это можно сделать с помощью кодировки base64 с использованием стандартного объявления @ font-face.Использование препроцессора позволяет отключить определенные шрифты, просто закомментировав их (используя sass / less comments).

Вот статья, объясняющая больше об этом методе.http://sosweetcreative.com/2613/font-face-and-base64-data-uri

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

Лично у меня есть основная таблица стилей с «обязательными шрифтами» и «расширенная» таблица стилей с дополнительными шрифтами, обеспечивающая выход из-под контроля размера передачи, когда используется много шрифтов.Мой порог составляет около 250 Кб, включая все стили, что составляет около 2-3 файлов шрифтов.Все, что находится за этой точкой, входит в "extended.css".

Приветствия

...