Что именно меняется в рендеринге css, когда настольные браузеры увеличивают или уменьшают масштаб веб-сайта?
каким образом дизайн масштабируется вверх или вниз? Я пытаюсь выяснить, что именно происходит на уровне CSS, и каковы последствия для разных методов калибровки (px, em, rem и т. д.).
кстати, меня в основном интересует поведение масштабирования для современных настольных браузеров. (Я подозреваю, что мобильный браузер является прямым расширением всей страницы после ее нормального отображения и знает, что старомодные браузеры просто увеличивают базу размер шрифта.) Однако неясно, что современные браузеры (скажем, последние версии Chrome или FF) делают именно тогда, когда пользователь нажимает Ctrl + или Ctrl -.
они также просто отобразить страницу нормально (т. е. на 100%) и потом просто увеличить изображение? Потому что FF все еще, кажется, уважает % ширины, например,поэтому это не кажется прямым расширением.
2 ответов
масштабирование, реализованное в современных браузерах, состоит не более чем из" растягивания " пикселей. То есть ширина элемента не изменяется от 128 до 256 пикселей, а пиксели удваиваются в размерах. Формально элемент по-прежнему имеет ширину 128 CSS пикселей, хотя он занимает пространство 256 пикселей устройства.
другими словами, масштабирование до 200% заставляет один пиксель CSS расти в четыре раза больше размера одного пикселя устройства. (В два раза шире, в два раза высота, дает четыре раза в общей сложности).
для подробного объяснения вы можете прочитать следующую страницу: концепция пикселей устройства и CSS пикселей
Если вы намекаете на то, что происходит в браузере при масштабировании, это зависит от того, какой браузер вы используете и на каком устройстве. Я считаю, что тип единицы измерения, которую вы используете в своем CSS, также может быть фактором ( % , em и px). Но обычно, скажем, CSS применяется к шрифтам,которые снова отображаются при увеличении. То же самое со значениями свойств фона. Но во многих браузерах этот рендеринг происходит так быстро, что вы даже не заметите его, если нет какой-то проблемы с производительностью замедление браузера (что может быть связано с кодом или системой).