logo标签列表

我们如何修复移动站点的图像大小？

cssimagehtmlmobile
3
我们如何调整同一张图片以适应 iPhone 竖屏和横屏模式以及 iPad 竖屏和横屏模式？
我的网站宽度为320像素，头部图片也是320像素，所以当我在横屏模式下查看此站点时，它看起来有点小，在iPad上甚至更小，那么我该如何将其固定在相同的设备宽度上？我使用媒体查询来实现这一点，并根据设备宽度固定图像宽度，例如：对于iPad，我编写图像大小为780像素，对于移动横屏380像素... 我是否以正确的方式做到了这点？还是有更好的方法？
我们可能需要更多的信息，您是否遇到了问题？您有例子吗？到目前为止，您尝试了什么？ - Kyle
2个回答
3

您目前使用的方法并不是最佳实践，它会产生一些无用的 CSS 代码。请在样式表的默认部分中直接使用以下代码即可，无需将其嵌套在不同尺寸的媒体查询中。

img { max-width: 100%; height: auto}

您可以通过这个链接了解更多有关响应式设计的五个有用的CSS技巧。
0

使用您的框架或PHP（User Agent中的strstr）检测您的设备，并为您的站点设置特定于设备的样式表。这个解决方案很好，可以仅加载已使用的CSS文件。

优化您的站点以适应所有解决方案和设备的最佳方法是使用响应式网页设计。这是一种相对于分辨率设计布局的方法。

以下是一些示例列表：

http://designmodo.com/responsive-design-examples/

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接