DarkBMW Опубликовано 18 Февраля 2016 Жалоба Поделиться Опубликовано 18 Февраля 2016 Может кто подскажет, как сдалать ретина лого в 3.4.* версии? Цитата Ссылка на комментарий Поделиться на других сайтах Прочее
0 Denis Chursinov Опубликовано 19 Февраля 2016 Жалоба Поделиться Опубликовано 19 Февраля 2016 Тут 3 варианта. Обычно лого это элемент img .Первый вариант - картинку положить в 2 раза большего разрешения, а в элементе img выставить width и height в 2 раза меньше. Есть у вас задумка сделать лого 300 на 100. Значит реальная картинка должна быть 600 на 200, а уменьшена до 300 на 100 уже в свойствах элемента.Второй вариант - подгрузить retina.js, который для всех картинок на странице будет пытаться загрузить @2 версии. http://retinajs.com/Третий вариант, это сделать лого фиксированным по размеру блоком, а картинку в него вставлять в качестве фона. Тогда ретину можно будет подгрузить через медиа-запрос в css /*CSS для обычных экранов:*/ .logo{ width: 300px; height: 100px; background-image: url(logo.png); } /*CSS срабатывающий на retina, у нее будет соответствующий "device-pixel-ratio":*/ @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-devicepixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx) { .logo{ background-image: url(logo@2x.png); background-size: 300px 100px; } } Цитата Ссылка на комментарий Поделиться на других сайтах Прочее
0 DarkBMW Опубликовано 21 Февраля 2016 Автор Жалоба Поделиться Опубликовано 21 Февраля 2016 Первый вариант - картинку положить в 2 раза большего разрешения, а в элементе img выставить width и height в 2 раза меньше. Есть у вас задумка сделать лого 300 на 100. Значит реальная картинка должна быть 600 на 200, а уменьшена до 300 на 100 уже в свойствах элемента. А где находится код для этого варианта? Заранее спасибо! Цитата Ссылка на комментарий Поделиться на других сайтах Прочее
0 Denis Chursinov Опубликовано 23 Февраля 2016 Жалоба Поделиться Опубликовано 23 Февраля 2016 В глобальных шаблонах - defaultHeader Цитата Ссылка на комментарий Поделиться на других сайтах Прочее
0 DarkBMW Опубликовано 24 Февраля 2016 Автор Жалоба Поделиться Опубликовано 24 Февраля 2016 Спасибо, всё красиво получилось Цитата Ссылка на комментарий Поделиться на других сайтах Прочее
Вопрос
DarkBMW
Может кто подскажет, как сдалать ретина лого в 3.4.* версии?
Ссылка на комментарий
Поделиться на других сайтах
4 ответа на этот вопрос
Рекомендуемые сообщения
Присоединиться к обсуждению
Вы можете ответить сейчас, а зарегистрироваться позже. Если у вас уже есть аккаунт, войдите, чтобы ответить от своего имени.