我正在使用这个出色的工具构建一个新应用程序,并且我有一个问题需要解决。
处理多个屏幕和多个设备的图像大小的最佳方法是什么。
Apple = 视网膜和非视网膜 Android = ldpi、mdpi、hdpi、xhdpi、xxhdpi 和平板电脑(所有这些都具有多种屏幕分辨率) BlackBerry10 = 一种分辨率(但不等于其他分辨率) WindowsPhone8 = 一种分辨率(但不等于其他分辨率)
对于这种情况,最好的方法是什么?
使用 SVG 图像(优化、性能、应用程序大小)??
为设备像素比例指定CSS标签(CSS图像替换)(设计师可以杀了我:smile: lol)参见列表http://bjango.com/articles/min-device-pixel-ratio/
CSS Sprite 表
另一种方式
在做出决定之前,请考虑什么最适合所有设备。
提前致谢
最佳答案
确实没有单一的方法可以做到这一点,因为图像的每种实现都需要根据其目的采用不同的方法。 SVG 很棒,但并非所有东西都可以作为 SVG 使用。
媒体查询将成为您的盟友。
请参阅:supporting multiple resolution and density of images in phonegap
这是另一种方法:Angular.js data-bind background images using media queries
还有一些针对 html5 图片元素的不错的 polyfill,您可能会发现它们很有用。
参见:https://github.com/scottjehl/picturefill
...及其 angularjs 指令实现 https://github.com/tinacious/angular-picturefill
关于image - 在 cordova-ionic-Angular 应用程序上处理多设备显示上的图像大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24276961/