css – 在大屏幕上修复FireFox与Chrome中的网站大小

似乎Gecko,Trident和Webkit在高分辨率屏幕上显示不同的网页显示方式.像Chrome和新Opera这样的Webkit浏览器会缩小页面以匹配屏幕的像素分辨率.但是,这可能会使小文本难以阅读.

另一方面,Firefox和Internet Explorer似乎有一些默认大小,如果分辨率更大,他们会假装屏幕具有更低的分辨率,而是使用额外的像素来增强抗锯齿.

现在的问题是：如何在这些不同的浏览器中获取我的网站大小？我的1920×1080显示器的差异大约是20％(您必须将Webkit浏览器缩放到正常大小的120％以匹配其他浏览器中的视图)

是否有一些CSS黑客滥用@viewport或其他方式来确保页面在浏览器中看起来相同？

解决方法

好的,所以假设您已经使用了视口元标记

<meta name="viewport" content="width=device-width,initial-scale=1.0">

将以下内容添加到CSS中：

html {
    font-size: 100%;
    -ms-text-size-adjust: 100%; 
    -webkit-text-size-adjust: 100%; 
}

另见MDN – text-size-adjust