用CSS覆盖HTML img

Question

我的jpeg是一个像前自我的像素化肥胖壳...是否有可能用css样式表覆盖html img高度/宽度代码而不是仅拉伸已经调整过的图像？我问的原因是客户让我使用godaddy的快速购物车(邪恶).它生成的代码会改变html中图像的大小.Godaddy只允许css改变,这就是我设法至少将图像拉伸回原始尺寸的方法.不幸的是,尽管我已经编写了img css,但似乎首先将html应用于图像,然后css将图像扩展为令人讨厌的像素.除了html中的高度和宽度规范之外,godaddy实际上已经将图像转换为服务器上的较小尺寸,尽管他们的技术人员否认这一点,然后代码将是多余的.我正在使用的CSS粘贴在下面,就像GoDaddy生成的不可更改的代码一样.

//FROM CSS

td.imageRow {
  padding: 10px 0 5px;
  vertical-align: middle;
  width:192px;
  height:250px;
}

.productTable img {
  border: 0 none;
  width:192px;
  height:250px;
}

.productTable a {
  width:192px;
  height:250px;
}


//FROM HTML
<tbody>
<tr><td class="imageRow"><a href="/Logo.htm">
    <img width="122" height="160" alt="Logo" src="/images/13129490572471789450105.jpeg">
    </a></td><td class="noBorder"></td><td class="noBorder"></td></tr>
    <tr><td class="titleRow"><a href="/Logo.htm">Logo</a></td><td></td><td></td></tr>
    <tr><td class="priceRow"></td><td></td><td></td></tr>
    <tr><td class="spacer">&nbsp;</td></tr>

Answer 1

你可以使用!important覆盖:

.productTable img {
  border: 0 none;
  width:192px !important;
  height:250px!important;
}

有关示例,请参见http://jsfiddle.net/GDVXw/.

为了说明这一点,我已将图像拉伸到这里,以便您可以更清楚地看到覆盖的工作原理:http://jsfiddle.net/GDVXw/1/.