it-roy-ru.com

Изменить CSS только для мобильных устройств?

Я только что закончил создание своего сайта, но теперь обнаружил ошибку. Моя проблема в том, что мой веб-сайт выглядит отлично на ПК. Но если я пойду и посмотрю на него со своего мобильного телефона, промежутки между определенными изображениями и т.д. Будут слишком большими ...

Итак, мой вопрос, как я могу создать некоторые CSS-коды, которые влияют только на мобильные устройства и, возможно, планшеты?

Есть ли способ?

3
Jan

В CSS есть функция медиазапросы . По ссылке MDN:

Медиа-запросы, добавленные в CSS3, позволяют адаптировать представление контента к определенному диапазону устройств вывода без необходимости изменения самого контента.

Например:

div {
    background: black;
}

@media (max-width: 1000px) {

      div {
            background: yellow;
       }

}

Цвет фона этого div будет желтым на экране при ширине 600 пикселей.

4
Eyal Cohen

Вы можете использовать медиа-запросы для разных разрешений экрана. Пример - 

#image img {
    width:375px;
}
@media screen and (min-width: 1366px) {
    #image img {width:375px;}
}
1
Purvil Bambharolia

Прочитайте и поймите о Медиа-запросы

Вы сможете настроить CSS определенных размеров медиа вашего сайта.

0
Joseph Vu