Question

我正在开发PhoneGap中的Android应用程序。我必须根据运行应用程序的屏幕大小调整一些按钮大小。在android中我们有sp，dpi。在jquery mobile中有任何类似的类型。

Answer 1

据我所知，我只是瞥见了jquery-mobile，并没有直接解决可变显示尺寸和像素密度问题。

还有其他机制可以解决这个问题：

将视口的target-densitydpi设置为medium-dpi（= 160dpi）。这会虚拟化px单位，例如然后，html / css中的1px对应320dpi设备上的2个物理像素。简单的解决方案，但请注意图像也是缩放的。
```
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=medium-dpi" />
```
CSS：使用媒体查询实现条件样式。根据宽度，高度，宽高比或方向调整不同的屏幕尺寸是直截了当的，请参阅http://www.w3.org/TR/css3-mediaqueries/。使用device-pixel-ratio可以处理不同的像素密度（感谢Marc Edwards提供示例：https://gist.github.com/marcedwards/3446599）。
```
@media screen and (-webkit-min-device-pixel-ratio: 1.5),
       screen and (-o-min-device-pixel-ratio: 15/10)
{
  body { background-image: ... } /* provide high-res image */
}
```
媒体功能resolution比device-pixel-ratio更清晰，但许多浏览器都不支持它。
使用Javascript：根据window.devicePixelRatio和window.screen.width以及window.screen.height调整按钮大小，图片等。按Javascript进行布局被认为是不好的做法。在pageload事件之后执行开始时，加载期间也可能导致闪烁。