gpt4 book ai didi

css - 桌面浏览器上的用户可扩展问题 : all of CSS disappears when zooming out to 33% and less

转载 作者:行者123 更新时间:2023-11-27 23:09:31 25 4
gpt4 key购买 nike

不确定为什么我会遇到这个用户可缩放(缩放)问题,我的所有样式在 Chrome 上完全消失了 @ 33% 或更少(IE11 更糟:75%)。

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=yes">
<link href="css/zoom.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 600px), only screen and (max-device-width: 1000px), all and (max-width: 1920px)" />
<link href="css/fm_styles.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 600px), only screen and (max-device-width: 1000px), all and (max-width: 1920px)" />
<link href="css/ninja-slider.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 600px), only screen and (max-device-width: 1000px), all and (max-width: 1920px)" />
<link href="images/fmstacked.ico" rel="shortcut icon" type="image/x-icon">
<script src="js/ninja-slider.js" type="text/javascript"></script>
<script type="text/javascript" src="js/w3-include-html.js"></script>

最佳答案

此问题与您的 css 中的媒体查询有关 <link> .如果我们删除 media="only screen and (max-width: 600px), only screen and (max-device-width: 1000px), all and (max-width: 1920px)"<link> , 那么这个问题就会消失。

当我们缩放浏览器时,它们表现为不同的设备,max-width会改变。在我的测试中,当我们缩小时,视口(viewport)宽度将变得大于 1920 像素,因此不会根据媒体查询应用样式表。

更多信息,您可以引用this thread .

关于css - 桌面浏览器上的用户可扩展问题 : all of CSS disappears when zooming out to 33% and less,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58596224/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com