web_Developer_Victor
@web_Developer_Victor
Что такое google?

Не подключаются svg так, как нужно?

У меня есть svg Twitter'a. Когда я подключаю через <img src="" alt=""> у меня все хорошо, но когда через <svg></svg> у меня получаестся криво
Результат
5b2fdcb5a6c76944032125.png
Справа через img, слева через тег svg.

Мне нужно при наведение и фокусе стилизовать картинку, потому я и выбрал <svg></svg>.
Какие могут бить проблемы?
HTML код
<ul>
	<li class="socialLink">
		<a href="https://twitter.com" target="_blank">
			<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="17" height="15" viewBox="0 0 17 15"><image overflow="visible" width="17" height="15" xlink:href="t.png"/><path fill="#FFF" d="M10.95.144c1.685-.496 2.984.27 3.577 1.179.673-.231 1.331-.481 2.011-.708a2.345 2.345 0 0 1-.857 1.768c.685.17 1.304-.491 1.304-.491-.169 1-1.006 1.788-1.563 2.024-.231 6.75-3.175 11.217-10.077 11.082h-.446c-.41 0-4.164-.46-4.898-1.887 2.271.196 3.893-.422 4.693-1.177-.96-.3-2.679-.477-2.979-2.95.349.106.564.228 1.19.119C1.705 8.247.374 7.53.448 5.33c.285.328 1.067.536 1.34.472C1.085 5.561-.182 2.442.894.85c1.818 1.854 3.735 3.606 7.152 3.773C8.254 2.33 9.183.793 10.95.144z"/></svg>
		</a>
	</li>
	<li class="socialLink">
		<a href="https://www.facebook.com" target="_blank">
			<img src="img/twitter.svg" alt="">
		</a>
	</li>
</ul>

SVG
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="17" height="15" viewBox="0 0 17 15"><image overflow="visible" width="17" height="15" xlink:href="t.png"/><path fill="#FFF" d="M10.95.144c1.685-.496 2.984.27 3.577 1.179.673-.231 1.331-.481 2.011-.708a2.345 2.345 0 0 1-.857 1.768c.685.17 1.304-.491 1.304-.491-.169 1-1.006 1.788-1.563 2.024-.231 6.75-3.175 11.217-10.077 11.082h-.446c-.41 0-4.164-.46-4.898-1.887 2.271.196 3.893-.422 4.693-1.177-.96-.3-2.679-.477-2.979-2.95.349.106.564.228 1.19.119C1.705 8.247.374 7.53.448 5.33c.285.328 1.067.536 1.34.472C1.085 5.561-.182 2.442.894.85c1.818 1.854 3.735 3.606 7.152 3.773C8.254 2.33 9.183.793 10.95.144z"/></svg>
  • Вопрос задан
  • 82 просмотра
Решения вопроса 2
web_Developer_Victor
@web_Developer_Victor Автор вопроса
Что такое google?
Проблему вырешил через opacity к img
Ответ написан
@lagudal
у вас в svg зачем то сохранена контуром png картинка, уберите ее и пересохраните svg.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы