这似乎不是一个不同的要求,但只是无法完成,这是我的 html 页面:http ://www.xiexianhui.com/baxjoomla15/index0.html
如果您打开页面并查看源代码,您将看到:
tr.spaceUnder > td
{
padding-bottom: -0.5em;
}
用于控制表格中行之间的间距。如果我需要更多空间,它可以正常工作,但如果我需要更少的空间,它就无法工作。如何减少页面中的空间?
在某些情况下,我还需要重新调整图像大小,我该怎么做?
这似乎不是一个不同的要求,但只是无法完成,这是我的 html 页面:http ://www.xiexianhui.com/baxjoomla15/index0.html
如果您打开页面并查看源代码,您将看到:
tr.spaceUnder > td
{
padding-bottom: -0.5em;
}
用于控制表格中行之间的间距。如果我需要更多空间,它可以正常工作,但如果我需要更少的空间,它就无法工作。如何减少页面中的空间?
在某些情况下,我还需要重新调整图像大小,我该怎么做?
padding不能为负。将其设置为 0,尝试添加cellpadding=0 cellspacing=0到您的<table>标签,例如
<table cellspacing=0 cellpadding=0>...</table>
将其应用于每个表。然后,应用margin: 0; padding: 0;到每个表格的样式。顺便说一句,我建议您显示td没有图像的标签,边框宽度为 1 像素,以完全符合您的喜好。然后,当它们很好时,您可以添加图像。
如果您希望每个图像完全适合单元格,则需要使每个单元格的宽度总和完全相同,因为行/列的高度/宽度获取行/列中最大元素的值,除非您手动设置。
更新 尝试将下一行应用于您的代码:
$( "img" ).each( function(){ this.style.padding = 0; this.style.margin = 0; } )
$( "td" ).each( function(){ this.style.padding = 0; this.style.margin = 0; } )
这使我们更接近预期的结果。
你的table元素中有td元素。你应该只有 1 个,而不是 3 个表。
要删除表格的默认间距,您应该执行以下操作:
<table cellpadding="0" cellspacing="0">
您应该从 td 元素中删除表格,因为它们看起来毫无意义。像这样的东西:
<table width="780" border="0" align="center" cellspacing="0" bordercolor="#000000" id="content" name="content">
<tr class="spaceUnder">
<td width="300"><img src="1930.png" width="300" height="130" /></td>
<td width="150"><img src="1931.png" width="149" height="130" /></td>
<td width="150"><img src="1930.png" width="149" height="130" /></td>
<td width="300"><img src="1651.png" width="300" height="130" /></td>
</tr>
<tr class="spaceUnder">
<td width="150"><img src="1931.png" width="149" height="130" /></td>
<td width="150"><img src="1931.png" width="149" height="130" /></td>
<td width="300"><img src="1930.png" width="300" height="130" /></td>
<td width="150"><img src="1931.png" width="149" height="130" /></td>
<td width="150"><img src="1931.png" width="149" height="130" /></td>
</tr>
</table>