Не хотел ставить ссылки на ресурсы fontawesome на сайт, так как сайт должен работать локально и мне не понравились их огромные CSS. Поэтому просто скачал их шрифт, вставил его как шрифт и стал добавлять иконки через :before используя код символа (есть на их сайте) Но когда попробовал вставить просто как <a>\F07A </a> ничего не появилось. Код символа работает только в шрифте. Тогда я установил шрифт на комп и из Word скопировал нужный символ. Он вставился в код в виде квадратика, но при этом на странице отобразился в виде нормальной иконки (возможно шрифт подцепился с компа).
Кто-нибудь знает как вывести символ из шрифта по его коду?
к сожалению песочница не подгружает внешние шрифты, поэтому эксперимент показать не могу.
<style>
@font-face {
font-family: 'fontawesome';
src: url('https://heeg.ru/fonts/fontawesome-webfont.eot');
src: url('https://heeg.ru/fonts/fontawesome-webfont.woff') format('woff'), url('https://heeg.ru/fonts/fontawesome-webfont.ttf') format('truetype'), url('https://heeg.ru/fonts/fontawesome-webfont.svg') format('svg');
}
a {
font-family: "fontawesome"; display:block; position:relative;
}
a:before { content: "\F07A"; font-family: "fontawesome"; position: absolute; font-size: 1em; z-index: 100; color: #eee; top: -10px; left: 0px; color:red; }
</style>
<body>
<a> привет!!! </a>
</body>