响应式网络需要多大尺寸的图像？答案

【问题标题】：What size of image or images do I need for Responsive web?响应式网络需要多大尺寸的图像？
【发布时间】：2013-07-01 01:03:26
【问题描述】：

我正在努力使我们的网站具有响应性。我想知道我是否有占据整个屏幕的图像，减去导航标题，我需要在每种类型的设备上工作什么尺寸的图像？我只需要一个吗？还是我需要 1024x768、800x600 等......？

示例：www.Squareup.com

【问题讨论】：

指定图片的最大宽度（max-width:200px）和高度；但不要指定固定宽度(width:200px);
或者您可以使用媒体属性为每个设备指定样式表...检查此w3schools.com/css/css_mediatypes.asp

标签： css image responsive-design

【解决方案1】：

这取决于您希望图片看起来有多好与您的网站加载速度有多快。通常在 RWD 中，您使用百分比来缩放图像以填充容器，因此大小不一定重要。

根据您如何缩放它，理论上任何尺寸都可以“适合”。另一方面，如果您不使用宽度百分比，那么您 1) 可能没有练习 rwd 2) 无论如何都可以为您的容器指定特定宽度，以便您的图像以任何方式填充它，因此任何尺寸都可以工作。此外，如果您为图像指定特定的最大宽度但使您的容器具有响应性，则任何尺寸都可能不“适合”容器。

不过，我建议现在至少 800x600 作为背景。也许目标环绕 1024x768 因为用户分辨率通常比现在更高。是的，只要您认为它在高分辨率屏幕上仍然看起来不错，您就可以拥有“只有一个”。我还建议重复纹理图案与摄影背景，它们很棒。

【讨论】：

【解决方案2】：

我不确定我是否理解你的问题但是您可以在图像上设置max-width: 100%，它们在不同的分辨率下看起来会很棒

【讨论】：