iPhone图像纵向和横向模式HTML5

时间:2013-05-17 15:36:42

标签: iphone html5 image retina

您好我一直在网上搜索,但无法找到明确的答案。

我目前正在转换html5网站,以便在iphone上使用。

我的查询是关于图像,肖像模式是320x960像素,风景是960x320px

对于视网膜显示而不是将我的图像设置为320x *(高度是成比例的)我将它们设置为png的640 x *

我将图像宽度设置为100%,视口大小设置为320px

这对于视网膜显示器是否正确?

当设备方向改变时,如果现有图像在横向模式下是100%,我将失去质量,我的客户希望能够使用捏缩放来放大。

那么我是否需要为纵向模式设置1个图像,为横向模式设置图像,然后将源URL与jquery交换?

所有图像都存储在数据库中,但我可以操作它们来自哪个文件夹,因此一组图像将位于横向文件夹中,另一组图像位于纵向文件夹中。

我认为这是有道理的,有人可以把我放在图像处理上 感谢

1 个答案:

答案 0 :(得分:1)

是的,视网膜显示器使用相同的基于维度像素的布局作为标准网页/或本机应用程序构建。引起人们兴奋的部分是源文件需要是页面中对象大小的两倍。

例如,这是一个源文件为40px X 40px的图像标记。

<img src="retina-images/my-button-40x40.png" width="20" height="20">