javascript – Implementierungsprinzip der Browser-Zoomgröße

Question

RT, aufgrund persönlicher Nutzungsgewohnheiten ist das Standard-Zoomverhältnis bei der Verwendung von Chrome auf 90 % eingestellt. Beim heutigen Testen einiger Seiten trat jedoch bei allen Browsertests eine Stilstörung auf normal, und der Test auf einem Computer mit niedriger Auflösung war auch normal, also kam ich auf die Idee, das Prinzip der Skalierung zu verstehen. Nachdem ich einige Informationen überprüft hatte, sagte ich, dass die Breite und Höhe des HTML-Tags waren Dies war jedoch nach dem tatsächlichen Testen nicht der Fall. Ja, daher möchte ich alle Experten fragen, was das Prinzip des Browser-Zoomens ist. Vielen Dank

Answer 1

我们正常看到的显示的页面一般为设备像素的大小（100%缩放），或者更准确的说是设备像素与css像素为1:1下的场景。当我们缩放屏幕的时候，设备像素不会变化，但css像素会变化。具体的推荐你看这篇博客：https://www.quirksmode.org/mo...

Answer 2

html {
  zoom: 90%
}

Answer 3

CSS 有 zoom 属性，可以控制内容的缩放。浏览器的缩放大概实现方式类似吧。至于错位问题，大部分浏览器对字体都有默认的最小值，当小于最小值后，文字并不会被缩放，导致了内容的折行，从而把布局撑开。