javascript - 哪个建议最适合调整用户视口的布局？

Question

我的目标是实现一个漂亮的设计跨界智能手机、平板电脑和台式机。完全不需要西装！该网站是高度动态的 - 就像一个问答游戏。每次回答后都会生成一个新问题（div 和 li 元素的复杂结构）

1. 通过ajax向php发送请求，取回完整的html；之后使用 jquery 纠正所有元素的宽度和高度
2. 通过ajax发送请求，只接收json格式的核心信息；完全在 jquery 中构建 html
3. 根据视口使用最匹配的样式表；通过ajax发送请求并接收完整的html

在我看来，建议 3 提供了足够的准确性，并且可能会比其他建议更好。

建议 3 更详细一点会像这样工作（只是一个例子！）：

switch(viewport){
 case > 1200 => include stylesheet1
 case > 980 => include stylesheet2
 case > 600 => include stylesheet3
 case > 400 => include stylesheet4
 case <=400 => include stylesheet5
}

Answer 1

我想这在技术上不是您问题的答案，因为我正在提出自己的建议：

您应该使用媒体查询。这让您可以为需要设计的每个特定视口定义样式。