Блог

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

Корректный рендеринг

Вот как он должен отображаться.

Рендеринг Safari

Вот как это делает Safari.

У меня нет большого опыта использования SVG в веб-дизайне, но я использую CSS, чтобы установить его в качестве фонового изображения, как и все остальное. Я не могу понять, что я делаю не так.

 .titleContainer{
  background-image: url(‘../img/logo.svg’)
}
  

Скорее всего, это связано с тем, что при экспорте SVG из вашей программы проектирования вам следует «преобразовать в контур». Я мог бы предположить, что вы выбрали для встраивания шрифта.

Т.Е. в Adobe Illustrator у вас есть возможность указать шрифт при экспорте:

Пример Adobe Illustrator