Как использовать пользовательский значок Fontello в качестве логотипа для веб-сайта? Как правильно изменить размер персонажа?

Question

Исходная проблема заключается в том, что мне нужен логотип, к которому я могу применить тень (текстовую тень), и заставить ее работать и в сетчатых дисплеях. Png с тенью, сделанной с помощью Photoshop, действительно не работают, если они должны поддерживать сетчатку и не-сетчатки.

Мое решение - сделать значок с Fontello. Но есть 2 проблемы:

1. http://petripottonen.com/fontello/ Вот демо проблемы. Размер символа/значка меньше фактического символа. Как это исправить? Проблема с исходным svg-файлом?

2. Как бы вы писать HTML, если вы будете использовать, например

   <h1 id="logo"><a href="#home"?>"><i class="icon-logo-font"></i>What to put here?</a></h1> 
   

   Я хотел бы поисковые системы и т.д., чтобы знать, что он говорит. С изображениями вы можете использовать alt-tag. Что бы вы сделали здесь?

Answer 1

Используя тот же .svg, что не работал с fontello работал при использовании icomoon http://icomoon.io/

Не уверен, что если icomoon на самом деле лучше, или если просто повезет.

Демо здесь: http://petripottonen.com/fontello/icomoon/demo.html

Все больше информации по этому вопросу ценится!

Answer 2

Используя ваш пример Fontello, попробуйте добавить следующую CSS в <i>:

display: inline-block; 
width: 220px; 
text-align: left; 
text-shadow: 2px 2px 2px #f00;