Я хочу имитировать большой экран (5600 * 1050) на своем локальном ноутбуке (1280 * 1024) и использовать медиазапрос.
Я попытался установить мета-ширину области просмотра = 5600, но, похоже, это не сработало. Я надеюсь, что div-оболочка должна быть синего цвета, потому что ширина области просмотра уже больше, чем 5600px.
мой тестовый код:
body {
margin: 0;
overflow: auto;
}
.wrapper {
width: 100px;
/* float: left; */
}
@media (min-width: 0px) and (max-width: 5600px) {
.wrapper {
background-color: red;
}
}
@media (min-width: 5600px) {
.wrapper {
background-color: blue;
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=5600, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<div class="wrapper">aaa</div>
<div class="wrapper" style="position: fixed; right: 0px; top: 0px;">ddd</div>
</body>
</html>
добавлена фотография