如何创建一个完全响应的网站(即“流畅”)，不会最终在平板电脑上显示狭窄的“移动”版本？ (通常网站的移动版本在设计时会考虑到拇指。它非常基本，通常是单列，并不真正适合平板电脑等较大的移动设备。)
即使您已将所有内容设计为可以优雅地缩放到每个宽度，您仍然需要 viewport 设置来告诉用户的手机以正确的宽度显示内容...但是此设置出现平板电脑也很荣幸。
我知道你可以使用检测解决方案(比如 Mobile Detect )，但它并不是完全流畅(尽管我想你可以使用 Mobile Detect 插入 viewport 元标记，如果手机被检测到)。有没有更好的方法让平板电脑显示桌面版本？
我觉得我错过了一个非常明显的技巧!
最佳答案
当被采纳到 CSS 标准中时它应该如何工作:
在 CSS 中使用 @media 查询以及 @viewport CSS 标签，而不是 meta viewport 标签。此处对如何执行此操作有很好的解释:
上面链接的例子:
@media (max-width: 699px) and (min-width: 520px) {
@viewport {
width: 640px;
}
}
您可以使用它在更窄和更宽的设备上设置不同的视口(viewport)。
但就目前而言，JavaScript 似乎是唯一的方法:
您可以监听 onResize 事件并检查屏幕的宽度，然后相应地调整 DOM 中的视口(viewport)元标记。
参见 http://www.webdevdoor.com/responsive-web-design/change-viewport-meta-tag-javascript
关于html - 在平板电脑上显示完全响应式网站的桌面版本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29866988/