Мобильная версияПочему второй медиа-запрос не может изменить свойство ширины на 100 %, когда разрешение дисплея становится ниже 600 пикселей?
Я хочу, чтобы при открытии на экране размером менее 600 пикселей свойство ширины было равно 100%.
Я попробовал это в редакторе w3s, и это сработало. и если я попробую Google Chrome, это не сработает. Я открыл его и просмотрел веб-консоль Chrome, результаты оказались не такими, как ожидалось. когда экран меньше 600 пикселей, ширина остается на уровне 50%, хотя я хочу, чтобы ширина была 100% в соответствии с моим вторым медиа-запросом. Это проблема с Chrome или что-то в этом роде?
Взгляните на мой последний скриншот
* { маржа: 0; заполнение: 0; размер коробки: граница-коробка; семейство шрифтов: с засечками; } тело { фон: URL(latihan/aset/gambar/a.png); размер фона: обложка; фоновая позиция: центр; высота: 100вх; } заголовок { дисплей: гибкий; оправдание-содержание: пространство вокруг; ширина: 100%; высота: 80 пикселей; положение: фиксированное; выровнять-элементы: по центру; z-индекс: 99; коробка-тень: 0 0 10px #000; фон: белый; } #chk1 { дисплей: нет; } я { курсор: указатель; } логотип заголовка { гибкий: 1; цвет: #251e1e; поле слева: 10 пикселей; преобразование текста: верхний регистр; } заголовок ул { гибкий: 2; дисплей: гибкий; оправдание-содержание: равномерно по пространству; } заголовок ул ли { тип стиля списка: нет; } заголовок ул ли а { текстовое оформление: нет; преобразование текста: верхний регистр; вес шрифта: 500; черный цвет; } заголовок ul li a:hover { нижняя граница: 2 пикселя сплошной RGB (201, 63, 63); } заголовок .меню { дисплей: нет; размер шрифта: 2em; } @media(максимальная ширина: 1000 пикселей) { заголовок ул { положение: фиксированное; верх: 100 пикселей; фон: rgba(0, 0, 0, 0,5); высота: расчет (100vh – 100 пикселей); ширина: 50%; слева: -100%; гибкое направление: столбец; выровнять-элементы: по центру; переход: левый 0,5 с линейный; } заголовок ул ли а { белый цвет; размер шрифта: 3em; } заголовок .меню { дисплей: блок; ширина: 100 пикселей; выравнивание текста: по центру; } #chk1:проверено~ul { слева: 0; } } @media(максимальная ширина: 600 пикселей) { заголовок ул { ширина: 100%; } Веб-мастер [*]Главная [*]Продукт [*]Блог [*]Связаться Значок[/i]
