Html CSS流体布局和图像

我正在尝试用CSS创建一个完全流畅的布局（一切都在%），它可以无缝地跨平台工作（桌面/手机/平板电脑，如iPad）

使用流体布局，图像是否可以完全流体化？例如：

img { max-width:100%; }

• 这是否意味着它将调整/适应任何范围或窗口大小
• 这也可以应用于背景图像吗
• 此属性在浏览器实现或其他方面是否有任何限制

---

您提供的代码片段表示图像的最大宽度为

100%

。这可能意味着不会比浏览器窗口或设备视口更宽。它也可能意味着不比相对定位的父节点宽。但是，如果窗口足够大，图像将以其本机大小渲染

它不能应用于背景图像，因为背景图像本身是基于其原始大小平铺或定位的。

max width

技巧主要用于内容图像，而不是布局或样式图像

---

它是有限的，因为IE6根本不支持它。但是，这个市场非常小，而且正在缩小，所以您可以忽略这个问题。

您的代码意味着图像相对于其父图像宽度的大小。假设图像所在的div是500px宽，那么图像的最大宽度可能是500px，或者更小，而不是更大。有关最大宽度的详细信息：

对于背景，这种方法的效果稍有不同，您可以使用

backgroundsize:xy用于此。它是CSS3，旧浏览器不支持它。有关背景大小的详细信息：