Скачать svg embed font - Скачать исходный код svg embed font

svg embed font

Загрузка шрифта

Initial release

Скачать

Встраивать шрифты в активы SVG

SVG полезен для разрешения, независимого от устройства, но часто может быть болью, потому что шрифты должны быть встроены в файл, чтобы правильно отображаться во всех браузерах. svg-embed-font -это инструмент командной строки, чтобы легко определить, какие шрифты используются в файле SVG, и кодируйте их в качестве активов Base64 в нем.

Если ваши активы SVG отлично смотрятся на вашем компьютере и испортились на всех остальных, это потому, что шрифты не встроены в файл.

Использование

 svg-embed-font input.svg

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

 font-family: 'Permanent Marker'

Matches:
permanentmarker.ttf
PermanentMarker-700.otf

В этом случае есть два возможных матча, которые часто могут происходить, когда шрифт выходит в нескольких весах. Чтобы указать, что следует использовать, перечислите шрифт в командной строке после входного файла. Несколько возможных совпадений должны быть разрешены путем перечисления правильного в командной строке.

 svg-embed-font input.svg permanentmarker.ttf

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

Поиск пути файла шрифта

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

Как это работает

Файл шрифта кодируется BASE64 и включен в качестве актива стиля, таблицы, непосредственно в файл SVG. Если вы откроете файл в текстовом редакторе, прямо перед закрытием </defs> Tag вы увидите что -то вроде следующего для каждого шрифта:

 <style type="text/css">
	<![CDATA[
		@font-face {
			font-family: 'Permanent Marker';
			src: url('data:application/x-font-ttf;base64,AAEAAAAOAIAAAwBgT1MvMmH1Ke...<lots more>');
		}
	]]>
</style>