如何根据设备/屏幕分辨率调整屏幕？
Posted
技术标签:
【中文标题】如何根据设备/屏幕分辨率调整屏幕？【英文标题】：How to fit screen as per device/screen resolution? 【发布时间】：2013-06-26 06:55:33 【问题描述】：我已经使用 Extjs4.1 完成了应用程序，效果非常好。客户端他们需要屏幕，就像他们在手机以外的不同设备中访问应用程序 URL 时一样。所有屏幕都应该适合每个设备，没有任何水平/垂直滚动条。 我在 index.html 文件的 head 中包含了一行代码，meta 标记如下。所以现在应用程序在没有任何滚动条的情况下适合 ipad。 在我的桌面显示器中，屏幕也很适合，但如果我在笔记本电脑水平/垂直滚动条中浏览，相同的应用程序 url。如何在 ipad/桌面显示器等笔记本电脑设备中安装所有屏幕？我没有使用 flex，因为如果它是小型设备，它将适合，但问题所有组件将在另一个之上合并（重叠），同时最小化/最大化也有问题。 任何人都可以告诉我如何解决这个问题吗？ 非常适合。谢谢
代码在这里：
<head>
<meta name="viewport" content="width=1024">
</head>
【问题讨论】：
设备有不同的纵横比。此外，iPad 的宽度是 1024，而不是 1124 我已经更新了，你能给我笔记本电脑的解决方案吗？ 试试这个 我已申请但出现错误：视口参数值“no;”对于无法识别的关键“用户可扩展”。内容被忽略。 k 去掉那些使用 user-scalable=no 并且只设置宽度和高度的。 【参考方案1】：在 extjs 中无法区分笔记本电脑和台式机设备。我走了不同的路。但这不是正确的方法。我们可以按要求实现。在视图中全局计算屏幕的高度。如果屏幕分辨率为 1600x900（桌面）window.ineerHeight 将超过 700。如果屏幕分辨率小于 1600x900 window.innerHeight 将小于 700。所以这里计算分配给组件的动态值。它对我来说非常好用。干杯
这是我的代码：
if(window.innerHeight>700)
var paddingValue = 10;
var imgHeight = window.innerHeight/4.1; //Desktop
else
var paddingValue = window.innerHeight/35;
var imgHeight = window.innerHeight/5.7; //Laptop
【讨论】：
以上是关于如何根据设备/屏幕分辨率调整屏幕？的主要内容，如果未能解决你的问题，请参考以下文章
如何对我的网站进行编码，以便我的 100% 宽度图像根据屏幕分辨率的变化调整大小？
如何编码我的网站，以便我的100％宽度图像根据屏幕分辨率变化调整大小？