Решает проблемы с CSS и HTML - PullRequest
Новая
       14

Решает проблемы с CSS и HTML

0 голосов
/ 28 июня 2018

Я делал сайт с этими файлами HTML и CSS:

https://pastebin.com/Ldh12gt7 для HTML

https://pastebin.com/8igc0DXm для CSS

Он отлично отрисовывается в моем браузере, а также отлично отрисовывается в других браузерах, кроме моего ПК.

У меня разрешение 1920х1080, и там отображается веб-сайт https://i.imgur.com/OOnhDSa.png

Но, когда мой друг пытается загрузить его с разрешением 1680x1050, веб-сайт выглядит так https://i.imgur.com/gmSgAPx.png

Как я могу это исправить? Я уже пытался это сделать разными способами.

Сначала я установил всю ширину и высоту в процентах.

Затем я использовал normalized.css (без эффекта, поэтому я его удалил).

Итак, я попытался установить размер шрифта с различными значениями (vw, vh, ch, em и т. Д. И т. Д.), Но не сработало.

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

Да, мой друг тоже попытался установить разрешение 1920x1080, но ничего не изменилось.

1 Ответ

0 голосов
/ 28 июня 2018

Вы должны использовать медиа-запросы как:

Измените *value* соответственно.

Чтобы настроить CSS для меньших экранов, чем ваш: 

@media only screen and (min-width: *value*) {
    .class_name{
        //new CSS property
    }
}

Чтобы настроить CSS для больших экранов, чем ваш: 

@media only screen and (max-width: *value*) {
    .class_name{
        //new CSS property
    }
}

После этого вы можете проверить скорость отклика и просмотр вашей веб-страницы на устройствах с разными размерами экрана, используя это приложение

...