css 为什么高度为1- 2 px的小html元素会根据设备分辨率的不同而改变其高度？

daupos2t 于 2023-04-23 发布在其他

关注(0)|答案(1)|浏览(104)

我有这个菜单图标，它是从一个span标签和::before ::after元素创建的，看起来像这样：

<div>
        ::before
        <span />
        ::after
     </div>

上图浏览器100%缩放
当我在浏览器中放大和缩小时，元素的高度不同，所以从2px的高度看，它们似乎有1px或介于两者之间的高度

浏览器放大150%以上的图像
在150%变焦它是最接近正确的显示，但中间，但似乎有点.
我已经试过改变父高度，间距，我能想到的一切，但我不知道问题是从哪里来的。

1条答案

一些微小的HTML元素，比如你的菜单图标，可能看起来会抖动，因为我们现在的小工具通常有一个大于1的像素比。当逻辑像素与屏幕上的物理像素不匹配时，就会发生这种情况。而且，当你放大时，屏幕上的逻辑像素数会改变，这可能会导致像菜单图标这样的小元素看起来像是随着浏览器调整以匹配设备上的物理像素而改变大小。