高分辨率屏幕上的网站太小

Question

我有一个采用响应式设计的网页（我使用了 Bootstrap）。一切都非常适合移动设备、平板电脑和桌面尺寸。但是当我使用高分辨率屏幕或设备（超过 1920x1080px）时，网站变得非常小。

我尝试在高分辨率设备上进行缩放，但遇到了错误（如下所列）。

@media (min-width: 1900px){ 
  html { 
    zoom: 150%;
    -ms-zoom: 1.5;
    -webkit-zoom: 1.5;
    -moz-transform:  scale(1.5,1.5);        
    transform-origin: center top ;
  } 
  body {  /* use only for IE */
    zoom: 1.5;        
    /* -ms-transform-origin: left top; */
  }
}

错误：

1. 不以 IE 为中心

2. 影响 IE 和 Firefox 中的 jScrollPane 插件滚动速度

还有其他解决方案吗？

Answer 1

您不必搞乱缩放。只需将以下行添加到您的head部分即可。

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