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

Question

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

你能告诉我什么是一个好的解决方案吗？我为高分辨率设备尝试了缩放，但我遇到了错误（如下所列）。

@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">

Answer 2

我这样做的方法是使用CSS 浏览器选择器在 IE 中手动居中和修复网站，除此之外，当您不想为高分辨率屏幕重新构建网站时，缩放是一个非常好的选择。