如何在 chrome、IE 和 safari 中调整图像大小答案

【问题标题】：How to get images to resize in chrome, IE and safari如何在 chrome、IE 和 safari 中调整图像大小
【发布时间】：2011-06-25 07:45:38
【问题描述】：

我正在开发一个使用 jquery tabs api 的网站。对于每个选项卡，我都有一张图片，当浏览器的大小发生变化时，我想调整它的大小。

这是其中一个选项卡的示例

<li style='width:15%'>
  <a href="/fu...">
   <img src="/Funde..." alt="BreakOut" class="breakoutFundviewImage">
  </a>
</li>

通过使用简单的 CSS，我可以在 Firefox 和 IE 中正常工作

.breakoutFundviewImage
{
    height:30px;    
    width: 100%;    
}

不幸的是，这在 chrome、safari 中不起作用。图像只是以全尺寸显示，因此在选项卡中只能看到一半的图像。

有谁知道这样做的正确方法吗？任何帮助都会很棒。

【问题讨论】：

【解决方案1】：

不要在图像上设置高度，否则会破坏纵横比。你的代码是正确的，所以如果他们没有调整大小，那是因为父标签比你想象的要宽。你可能有一些溢出：隐藏在内部元素被裁剪而不是调整大小的地方。

【讨论】：