如何在不同屏幕尺寸的不同浏览器上调整网站的缩放比例？

Question

我已经部署了一个网站，它的缩放比例在屏幕分辨率1920x1080时还可以。 我想以屏幕分辨率1366x768缩放80％。

我试图设定

@media only screen and (min-width: 768px) {
    body {zoom: 80%;}
} 

它在chrome中工作正常，但在Internet Explorer和Microsoft Edge中无法正常工作。

我已将meta标签用于视口。

<meta name="viewport" content="width=device-width, initial-scale=0.6,               maximum-scale=1, user-scalable=0">

我希望在屏幕分辨率为1366x768的情况下，页面缩放比例设置为80％。 并且它应该与所有浏览器兼容。

Answer 1

尝试使用scale

@media only screen and (min-width: 768px) {
 transform:scale(0.8)
 transform-origin: 0 0;
}

Answer 2

您可以使用媒体查询https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

也许这也可以为您提供帮助https://css-tricks.com/snippets/html/sensitive-meta-tag/