javascript - 瀏覽器縮放小的實作原理

Question

RT,因為個人使用習慣的原因，使用chrome都是把預設縮放比例調成90%的，今天測試一些頁面的時候出現了樣式錯亂的問題，然而在縮放比例為100%的情況下，所有的瀏覽器測試都正常，並且在低解析度的電腦上測試也正常，所以萌生了了解縮放原理的想法，查了一些資料後說是更改了html標籤的width和height，然而經過實際測試並不是這樣的，所以想問各位大牛，瀏覽器縮放的原理究竟是什麼，謝謝

Answer 1

我們正常看到的顯示的頁面一般為設備像素的大小（100%縮放），或者更準確的說是設備像素與css像素為1:1下的場景。當我們縮放螢幕的時候，裝置像素不會變化，但css像素會變化。具體的推薦你看這篇部落格：https://www.quirksmode.org/mo...

Answer 2

雷雷

Answer 3

CSS 有 zoom 屬性，可以控制內容的縮放。瀏覽器的縮放大概實作方式類似吧。至於錯位問題，大部分瀏覽器對字體都有預設的最小值，當小於最小值後，文字並不會被縮放，導致了內容的折行，從而把佈局撐開。