mul*_*axp 10 mobile html5 css3 jquery-mobile
我们正在设计一个移动网站的模板,我们遇到了一个问题,我们不知道徽标的大小,或背景等.
我们将使用Jquery移动API和HTML5/CSS3,这基本上允许我们创建网站的整个架构而不用担心尺寸,但就外部资产如背景和图像而言,我们不知道什么是最佳尺寸.为了与大多数设备更兼容.
Bla*_*ger 12
iPhone 4S/5的高分辨率屏幕宽640像素.许多Android智能手机的最大宽度为720px,但有些则高达800px.任何东西都可能被视为平板电脑.
那么,就广泛的兼容性而言,你可以做的最好的事情就是单一的CSS风格:
img { max-width: 100%; height: auto; }
这将确保无论屏幕的分辨率如何,您的图像都不会大于包含它的元素.(在构建具有移动用户的响应式网站时,您的元素宽度,边距和填充应尽可能以百分比计算.)显然,这也意味着您下载的图像数据比许多手机需要的更多,但如果您"处理双色标识,这没什么区别.与往常一样,保持您的图像尽可能少和尽可能小.
此外,如果您不处理照片,则应查看SVG图像.由于它们是基于矢量的,因此它们可以在任何分辨率下完美调整,并且除了IE8和Android 2.x之外,它们几乎兼容所有浏览器.