图像宽度与父元素相同？答案

【问题标题】：Image width the same as parent element?图像宽度与父元素相同？
【发布时间】：2013-12-07 10:14:27
【问题描述】：

我有一个图像，我需要一个最大宽度作为其父元素。

使用此代码，图像以 600 像素的宽度显示。我需要图像的宽度等于 400 像素，即使图像的自然宽度是 600 像素。

我该怎么做？

<div style="width: 400px">
   <table>
    <tr><td>
      <img widht="600" ..../>
   </td></tr>
  </table>
</div>

我有这个 CSS：

table, img
{max-width:100%}

【问题讨论】：

标签： css

【解决方案1】：

 img{  width: 100%; }

会帮你解决的。这会将图像宽度“扩展”为包含元素的大小。

【讨论】：

【解决方案2】：

去掉img 中的width 属性。然后用max-width:100% 跟进它，就可以了。

【讨论】：

【解决方案3】：

如果你只关心 parent-img 关系，你不需要一个表......在那种情况下......

See this fiddle

HTML

<div>
   <img src='http://www.mibz.com/wp-content/uploads/2009/10/tesla-model-s-large-3.jpg' />
</div>

CSS

div{
    width:200px;
}
img{
    max-width:100%;
}

【讨论】：

问题是我的图像元素在小提琴中的代码中具有属性：height like: mibz.com/wp-content/uploads/2009/10/tesla-model-s-large-3.jpg' />。