Разные логотипы для стиля

[COB16]

Короче такой вопрос возник: мне надо на одном стиле сделать 2 логотипа, первый для ПК а второй для телефонов и прочего мелкого. Как так реализовать?

[Alecto]

1 - скриптом проверять изменение размера окна браузера и обрабатывать нужные блоки.
2 - CSS, не проверял, но как-то так

Код: Выделить всё

@media only screen and (max-width: 700px), only screen and (max-device-width: 700px) {
.imageset.site_logo {
    background-image: url("./images/site_logo.gif");
}
}

вставляешь свое изображение, нужное разрешение... короче - делаешь что душе угодно.
погугли второй вариант, он мне нравится больше.

[владимир1983]

@media

[COB16]

Alecto, а какая ширину выставить мин для большого логотипа?

[Alecto]

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

Отправлено спустя 6 минут 28 секунд:
кстати, ты можешь не логотип менять, а изменить его масштаб
например, при разрешении экрана 480пикс масштаб лого изменится с 100 до 70%

Код: Выделить всё

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
.imageset.site_logo {
background-size: 70% auto;
}
}

это и проще и правильней.

[COB16]

Alecto, пропадает логотип с экрана на ПК при такой правке

[Alecto]

для пропадания нет никаких предпосылов, логотип просто становится меньше, если конечно ты еще чего в цсс не добавил.
пропадет только если ты в паддинги полезешь.
проверил у себя - работает.
файрбагом у тебя на гольфе - тоже работает.
CTRL + R страницу обновлял?

[COB16]

Alecto, щас стоит не то лого что надо) добавлял твою строчку и сразу пропадает лого) ладно завтра буду копать

[Alecto]

добавь и дай ссылку посмотреть