Я хочу применить коэффициент масштабирования ко всему телу веб-страницы через CSS (или JS, если только CSS не возможен). Это было бы легко в любом современном браузере, я могу просто использовать правило CSS, например:
body {zoom: 75%;}
Это правильно работает в Chrome, как вы можете видеть на следующих скриншотах: исходная страница:
правильно масштабируется в Chrome:
Однако, к сожалению, я должен поддерживать IE 11: /
И то же решение, похоже, не работает в IE 11: как вы можете видеть, применение коэффициента масштабирования к телу страницы не масштабирует содержимое, оно изменяет размер самого элемента body, делая его меньше:
Я попытался выполнить компенсацию, изменив размер тела до значения, превышающего 100%, но, хотя это возвращает тело к полному размеру, оно также нарушает макет страницы (элементы начинают накладываться / отделяться странным образом)
РЕДАКТИРОВАТЬ : различные комментарии предлагают использовать масштабирование, но я уже пытался использовать
transform: scale(0.75);
но это не дает желаемого результата ни в Chrome, ни в IE. С scale я получаю результат, похожий на скриншот 3 в обоих браузерах, с той лишь разницей, что в этом случае тело центрируется с белым прямоугольником вокруг него, а не привязывается к верхнему левому углу (что, как я полагаю, связано с тем, что Я не использую transform-origin: top left, если я добавлю, что получаю точно такой же результат, как на скриншоте 3).
Есть ли способ сделать это в IE? В идеале я хотел бы иметь такое же поведение, как если бы пользователь фактически увеличивал масштаб окна браузера, используя CTRL+ или CTRL- (который работает правильно в IE и дает мне тот же результат, что и на втором снимке экрана)
РЕДАКТИРОВАТЬ 2 : образец страницы , где вы можете проверить это, просто нажмите F12 и попробуйте применить увеличение <100% к элементу тела. В chrome вся страница будет масштабироваться, в IE вместо этого тело будет уменьшаться (ps: на моем ПК эта страница заставляет инструменты разработчика IE зависать на несколько секунд, когда вы открываете их, но просто подождите немного, и они снова начнут отвечать) </p>