我一直在使用 Phonegap 为 Android 开发移动应用程序。我在使用屏幕 DPI 和键盘显示 时遇到困难。
如何在不同屏幕分辨率下使用不同 dpi 的图像?我希望屏幕在键盘出现时滚动。
我使用 position:absolute 和 % 作为元素的宽度、高度和字体大小,以便我的应用程序根据各种屏幕尺寸和方向进行调整。
所以,现在我想要键盘问题和图像问题的解决方案。
最佳答案
@media screen and (-webkit-device-pixel-ratio: 0.75) {
#app-icon { background-image:url(pictures/ldpi/app-icon.png); }
#brand-icon { background-image:url(pictures/ldpi/brand-icon.png); }
}
/* Medium density (160), mdpi */
@media screen and (-webkit-device-pixel-ratio: 1) {
#app-icon { background-image:url(pictures/mpi/app-icon.png); }
#brand-icon { background-image:url(pictures/mdpi/brand-icon.png); }
}
/* High density (240), hdpi */
@media screen and (-webkit-device-pixel-ratio: 1.5) {
#app-icon { background-image:url(pictures/hdpi/app-icon.png); }
#brand-icon { background-image:url(pictures/hdpi/brand-icon.png); }
}
/* Extra high density (320), xhdpi */
@media screen and (-webkit-device-pixel-ratio: 2) {
#app-icon { background-image:url(pictures/xdpi/app-icon.png); }
#brand-icon { background-image:url(pictures/xdpi/brand-icon.png); }
}
你可以通过方向
ORIENTATION - and (orientation: landscape)
Device WIDTH and (min-device-width : 480px) and (max-device-width : 854px)
Example:
@media screen and (-webkit-device-pixel-ratio: 1.5) and (min-device-width : 640px) and (max-device-width : 960px) and (orientation: landscape) {
/* Your style here */
}
关于android - 手机间隙 : Image size and keypad issue,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20896701/