1

Добрый день ребят. Вопрос меня мучает уже давно. В версии на ПС лого нормальное, более менее четкое. Но после того как я захожу с телефона, там лого просто мыльное . Где смотреть в коде. Какие значения могут влиять на лого мобильной версии? Сайт. Версия с телефона :введите сюда описание изображения

Вот версия с ПС: введите сюда описание изображения

2
  • какой размер картинки? используется одна и та же картинка?
    – Grundy
    23 апр 2016 в 15:58
  • 221х191, да одна и та же 23 апр 2016 в 17:18

2 ответа 2

1

Можете сделать для основного сайта лого одного размера, а для мобильных - другого.
Сделать это можно так:

.logo {
    background-image: url('logo.png');*/
}

@media (max-width: 660px) { // Можете указать другую макс. ширину
    .logo {
        background-image: url('logo2.png');*/
    }
}


@media позволяет указать тип носителя, для которого будет применяться указанный стиль.

Удачного кодинга...

3
  • Спасибо за кодинг, и огромное спасибо всем ребятам которые участвуют в мои "тупых" вопросах. Я теперь пошел по другому пути. Сделал лого в .svg. Но почему то когда я его делаю в corel он идеален, экспортирую его в .svg.... и все съедает качество и все кривые плывут. Я просто очень дотошный, я мог бы закрыть глаза на это. На МЫЛЬНОЕ ЛОГО. Но я хочу быть честен перед собой. И сделать все возможное. 23 апр 2016 в 19:28
  • Как я понял тег @media отвечает за показ на устройствах мобильных ? 23 апр 2016 в 19:29
  • Не за что) Благодарность можешь выявить путем плюсов) @media позволяет указать тип носителя, для которого будет применяться указанный стиль. Можешь попробовать данный сервис: image.online-convert.com/ru/convert-to-svg 23 апр 2016 в 20:44
1

Изображение само по себе небольшое, поэтому при увеличении оно размывается. Вам нужно либо использовать векторную графику (к примеру svg). Либо увеличить разрешение самого изображения, но тогда нужно задавать необходимые размеры изображения и желательно его оптимизировать для web, чтобы ускорить загрузку.

2
  • А не подскажите svg поддерживается html ? Я всегда думал что только gif png jpg :D 23 апр 2016 в 17:12
  • SVG можно встроить как через обычный img, так и как css - background, и через html5-тег <svg>. Если вы все-таки решили использовать его, то лучше почитать отдельные ресурсы, связанные с ним. К примеру, area53.ru/html5/kak-vstavit-svg-v-html.html
    – Daniel-664
    23 апр 2016 в 18:00

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.