Какие есть способы подключить шрифт к SVG? [дубликат]

191
13 апреля 2018, 13:41

На данный вопрос уже ответили:

  • Не подключается шрифт к SVG 1 ответ

Есть такой SVG файл.

<svg height='100' width='100' viewBox='-3 -3 100 100' xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"> 
  <style> 
    .polylogobox { 
      fill: #ef402a; 
      transition: .2s; 
    } 
    .polylogobox:hover { 
      fill: #fff; 
      stroke: #ef402a; 
      stroke-width: 3px; 
    } 
    .polylogobox:hover + text { 
      fill: #ef402a; 
    } 
    .logoletter { 
      font-size: 26px; 
      fill: white; 
      font-family: 'Raleway', sans-serif; 
      transition: .2s; 
    } 
    .logoname { 
      font-size: 32px; 
      fill: white; 
    } 
  </style> 
  <polygon class='polylogobox' points='22,0 44,0 48,6 72,6 72,46 22,46' /> 
  <text class='logoletter' x='38' y='36'>E</text> 
  <text class='logoname' x='6' y='94'>Expire</text> 
</svg>

К странице html он подключается посредством тега object.

Появился вопрос, какие есть способы подключить свой шрифт к этому svg файлу?

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

Первый вопрос

Когда я добавил link в svg файл, то у меня выбило ошибку. Пробовал гуглить, ничего толкового по этому поводу - нет.

Answer 1

Вы прописали стили. Что мешает прописать правила для подключения (загрузки) шрифтов через @font-face? Если пытались подключить стили через тег link в файл svg, то наверное вы забыли его закрыть по правилам XML.

<link href="fonts.css" rel="stylesheet" />

READ ALSO
Анимация при наведении на ссылки

Анимация при наведении на ссылки

Есть страница с 3 блокамиПри ховере на каждый блок происходит анимация — изменение цвета бэкграунда и анимация текста(пример, блок 1)

236
Поиск элементов в блоке

Поиск элементов в блоке

Как скриптом проверить, если у <li> есть див sub то <li> присвоить класс parent?

243
Easy Responsive Tabs не работает(JOOMLA)

Easy Responsive Tabs не работает(JOOMLA)

Получается так:

289
Нарисовать дерево из входных данных

Нарисовать дерево из входных данных

Помогите плиз, как отрисовать дерево от входных данных с json что б вышло что то подобное

217