easyfonts

Легкие шрифты

Easy Fonts предоставляет классы CSS для использования в HTML как <div classs="font-open-sans"></div> . Это облегчает использование шрифтов Google в ваших проектах. Легкие шрифты облегчают шаг на 2 шаге, так как вам больше не нужно повторять надувные шаги каждый раз, когда вы пробуете новую семью шрифтов:

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

С легкими шрифтами вы можете использовать один легкий файл CSS для импорта всех шрифтов в вашем проекте, и никогда не беспокоиться об импорте новых шрифтов.

Почему легкие шрифты

Легкие шрифты были разработаны для использования техники консолидации хоста, используемой PageCDN для ускорения веб -сайтов. Наша первоначальная цель состояла в том, чтобы позволить веб -сайтам, которые используют PageCDN для их доставки контента, также необязательно доставлять шрифты над тем же хостом CDN, чтобы уменьшить 2 дополнительных поиска DNS, требуемых шрифтами Google. Позже, легкие шрифты оказались очень полезной библиотекой для быстрого прототипа. Итак, мы перенесли его в GitHub для тех, кто интересуется самостоятельным размещением этой библиотеки или использовала ее в сочетании с fonts.google.com.

Используя легкие шрифты

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

 < link href =" https://pagecdn.io/lib/easyfonts/fonts.css " rel =" stylesheet " />

<!-- Or load specific font files
<link href="https://pagecdn.io/lib/easyfonts/open-sans.css" rel="stylesheet" />
<link href="https://pagecdn.io/lib/easyfonts/roboto.css" rel="stylesheet" />
-->

< div class =" font-roboto " >
    < div class =" font-open-sans w600i " >
        Stuff here appears in Open Sans, bold and italic
    </ div >
    < div class =" w600 " >
        Stuff here appears in Roboto, bold
    </ div >
    < div >
        Stuff here appears in Roboto and uses inherited weight and style
    </ div >
</ div >

:)

Если вы используете fonts.css , браузеры будут загружать только файлы шрифтов, которые вы фактически используете в своем HTML, и не будут тратить пропускную способность пользователя, загружая все шрифты. Сам файл fonts.css составляет всего 25 КБ при загрузке из Pagecdn. Pagecdn использует Brotli: 11 сжатие, чтобы очень плотно сжать файл, чтобы поддерживать размер в приемлемых пределах.

Импорт шрифта

dist Directory содержит файлы CSS для каждого отдельного семейства шрифтов, на которые вы можете ссылаться на свой HTML. Вы можете скачать библиотеку для игры с отдельными семействами шрифтов или ссылка на файлы CSS непосредственно из CDN. Ниже приведена ссылка на open sans Font. Для других семей шрифтов вот удобный инструмент поиска.

 < link href =" https://pagecdn.io/lib/easyfonts/open-sans.css " rel =" stylesheet " />

Импорт всех шрифтов

Чтобы быстро проверить различные шрифты, легкие шрифты позволяют легко импортировать все семьи шрифтов одновременно. Для этого вам необходимо использовать файл dist/fonts.css или использовать приведенную ниже ссылку CDN.

 < link href =" https://pagecdn.io/lib/easyfonts/fonts.css " rel =" stylesheet " />

Использование с шрифтами Google

Можно использовать простые шрифты и шрифты Google вместе. Вот как это сделать.

 < link href =" https://fonts.googleapis.com/css2?family=Open+Sans:ital@0;1&display=swap " rel =" stylesheet " > 
< link href =" https://pagecdn.io/lib/easyfonts/classes.css " rel =" stylesheet " />

Импорт шрифтов динамически

Easy Fonts предоставляет информацию о шрифте в формате JSON для отдельных семей шрифтов. Это поможет вам создать интерфейсы выбора шрифтов для тем и строителей веб -сайтов. JSON находится в каталоге dist/info . Вы можете загрузить информацию для отдельных шрифтов или использовать файл JSON, включающий все включенные для всей коллекции шрифтов.

Загрузить информацию всех шрифтов

 https://pagecdn.io/lib/easyfonts/info/fonts.json

Загрузить информацию о одиночных шрифтах семьи

 https://pagecdn.io/lib/easyfonts/info/open-sans.json

Лицензия

Файлы шрифтов TTF внутри dist/fonts представляют собой немодифицированные копии файлов TTF в Google Fonts Github Repo, где вы можете прочитать информацию о лицензировании. Отдельные семейства шрифтов имеют свои собственные файлы лицензии в dist/license . Соответствующие файлы лицензий связаны из каждого файла CSS, чтобы помочь вам легко просмотреть информацию о лицензии.

Файлы CSS и JSON в этом репозитории динамические сгенерированы только из файлов FONT и охвачены лицензией MIT. Если вам известно о лицензии с любой семьей шрифтов, указанной в этом репо, пожалуйста, откройте проблему, чтобы мы могли разрешить расхождение.