Да, как вариант, можно так.
Открываешь svg в браузере
Открываешь панель разработчика F12
Копируешь тег svg
Вставляешь прямо в то место где должна быть картинка вместо тега img.
Селектор выбирает элемент с айди main-slider И c классом carousel
такого элемента на вашем сайте нет, т.к.
элемент с классом carousel лежит В элементе с айди main-slider
Поправил.
Попробуй разобраться во всей этой штуке.
Покрути свойства, поотключай, посмотри что получается, почитай об этих свойствах на htmlbook.ru
Работа с фоновой картинкой предельно проста.
Важно соблюдать точные размеры блоков из макета.
Здесь очень кстати станет css свойство box-sizing: border-box;
Если его прописать, то паддинги будут работать немножко по другому.
Если будешь выравнивать паддингами то рекомендую делать это так:
- задать точные размеры блока (там вроде 34х34 было)
- задать этому блоку свойство box-sizing: border-box;
- после чего ковырять паддинги.
Это значит что на параметр line-height 16px вообще не нужно смотреть.
Для верстки этого логотипа из макета нужно взять только:
- цвета,
- семейство шрифта,
- размер шрифта,
- жирность шрифта,
- размер розового блока,
- размеры отступов.
и все получится.
Высота линии в макете (в данном случае) ни на что не влияет.
Артур Черешнюк: в фотошопе значения указаны в pt а не в px. Это немножко разные вещи.
К тому же я подозреваю, что line-height 16px - не имеет никакого отношения к высоте розового блока.
Скорей всего розовый блок вообще лежит на отдельном слое, я прав?
Как вариант, можно просто открывать ссылки на канал в новом окне.
Для этого в тег "a" допишите атрибут target="_blank"
В таком случае вы не покидаете страницу сайта, соответственно не придется возвращаться.