我有一个网站使用巨大的背景图片(2000×1500)在div容器(100%x 100%)。
当我在iPad上的Safari上打开该网站时,它会按比例缩小(约40%),比例不同于内容(约80%)。
我将背景移动到一个具有100%宽度和100%高度和溢出设置“隐藏”的div中的img标记。完全一样的发生。
有一个CSS设置,可以帮助Safari缩放背景图像与内容的相同比例?
解决方法
你应该为iPad创建一个单独的样式表。
您可以使用以下操作:
您可以使用以下操作:
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="../ipad.css" type="text/css" />
在此链接上,您将找到有关您的网站在iPad上的方向以及如何处理它的信息。
我的建议是,为您的网站的iPad版本创建一个单独的样式表(css文件),无论你做什么,你应该创建它,并添加一个链接标签,如上所示。
如果你有一个图片的背景是2000x1500px的iPad版本,你可以减少它适合iPad,如果这是唯一的问题。我想说你应该将图像的大小减少到1024px,并在iPad的单独的样式表中声明它,你会看到最终的结果。
让我知道它怎么回事。
BTW你也应该阅读这篇文章:http://www.inspiredm.com/2010/02/09/ipad-design/