我有这个菜单图标,它是从一个span
标签和::before ::after
元素创建的,看起来像这样:
<div>
::before
<span />
::after
</div>
上图浏览器100%缩放
当我在浏览器中放大和缩小时,元素的高度不同,所以从2px
的高度看,它们似乎有1px
或介于两者之间的高度
浏览器放大150%以上的图像
在150%变焦它是最接近正确的显示,但中间,但似乎有点.
我已经试过改变父高度,间距,我能想到的一切,但我不知道问题是从哪里来的。
1条答案
按热度按时间lmyy7pcs1#
一些微小的HTML元素,比如你的菜单图标,可能看起来会抖动,因为我们现在的小工具通常有一个大于1的像素比。当逻辑像素与屏幕上的物理像素不匹配时,就会发生这种情况。而且,当你放大时,屏幕上的逻辑像素数会改变,这可能会导致像菜单图标这样的小元素看起来像是随着浏览器调整以匹配设备上的物理像素而改变大小。