2016-10-28 46 views
0

我试过几个选项来做到这一点,但都没有工作。试图删除图像周围的填充物并收紧桌子。我认为必须有一些我可以使用的内联风格,但是我太过分了解这一点。任何帮助将不胜感激。覆盖CSS表格样式来删除填充

这是从photoshop生成的html。

<table id="Table_01" class=" alignleft" style="height: 291px" border="0" width="570" cellspacing="0" cellpadding="0"> 
<tbody> 
<tr> 
<td colspan="2"><a href="http://www.boem.gov/"> <img src="http://oceanleadership.org/wp-content/uploads/BOEM-Logo.jpg" alt="http://www.boem.gov/" width="297" height="115" border="0" /></a></td> 
<td colspan="2"><a href="http://www.jasco.com/"> <img src="http://oceanleadership.org/wp-content/uploads/JASCO-Logo.jpg" alt="http://www.jasco.com/" width="273" height="115" border="0" /></a></td> 
</tr> 
<tr> 
<td><a href="https://www.csaocean.com/"> <img src="http://oceanleadership.org/wp-content/uploads/CSA-Ocean-Sciences-Inc.-Logo.jpg" alt="https://www.csaocean.com/" width="152" height="96" border="0" /></a></td> 
<td><a href="http://www.ifaw.org/united-states"> <img src="http://oceanleadership.org/wp-content/uploads/IFAW-Logo.jpg" alt="http://www.ifaw.org/united-states" width="145" height="96" border="0" /></a></td> 
<td><a href="http://www.mbari.org/"> <img src="http://oceanleadership.org/wp-content/uploads/MBARI-Logo.jpg" alt="http://www.mbari.org/" width="125" height="96" border="0" /></a></td> 
<td><a href="https://schmidtocean.org/"> <img src="http://oceanleadership.org/wp-content/uploads/Schmidt-Ocean-Institute-Logo.jpg" alt="https://schmidtocean.org/" width="148" height="96" border="0" /></a></td> 
</tr> 
<tr> 
<td><a href="http://www.teledynemarine.com/SitePages/HomePage.aspx"> <img src="http://oceanleadership.org/wp-content/uploads/Teledyne-Marine-Logo.jpg" alt="http://www.teledynemarine.com/SitePages/HomePage.aspx" width="152" height="80" border="0" /></a></td> 
<td><a href="http://oceansonics.com/"> <img src="http://oceanleadership.org/wp-content/uploads/Ocean-Sonics-Logo.png" alt="http://oceansonics.com/" width="145" height="80" border="0" /></a></td> 
<td><a href="http://www.l-3mps.com/maripro/"> <img src="http://oceanleadership.org/wp-content/uploads/L3-Maripro-Logo.jpg" alt="http://www.l-3mps.com/maripro/" width="125" height="80" border="0" /></a></td> 
<td><a href="https://sea-birdscientific.com/"> <img src="http://oceanleadership.org/wp-content/uploads/Sea-Bird-Scientific-Logo.png" alt="https://sea-birdscientific.com/" width="148" height="80" border="0" /></a></td> 
</tr> 
</tbody> 
</table> 
<br /> 
+1

没有填充,其图像的实际'width'和'height'其中有大约产生 – Rohit

+0

_Photoshop_空白那?这是非常残酷的。表格上的'border = width = cellspacing = cellpadding ='已过时;与**'img' **标签上的'width = height = border ='相同......所有这些事情现在都应该在CSS中完成。 –

回答

0

使用内联样式是不是一个好主意,但包括属性风格=“填充:0像素,保证金:0像素”内嵌在你的img标签将确保浏览器未渲染任何周围多余的空间图像本身。更好的选择是包含一个.css文件和规则: td img padding:0px; margin:0px }

该规则应自动将样式分配给表格中的所有img标签。

0

它与图像的问题我删除了你的风格,因为你的图像仍然有它的空白。 你可以看到下面 代码 <table id="Table_01" class=" alignleft" style="height: 291px" border="0" width="570" cellspacing="0" cellpadding="0">

我删除了这种风格,在这里试图 Demo