在HTML表格中,单元格填充和单元格间距可以这样设置:
<table cellspacing="1" cellpadding="1">
如何使用CSS实现这一点?
在HTML表格中,单元格填充和单元格间距可以这样设置:
<table cellspacing="1" cellpadding="1">
如何使用CSS实现这一点?
当前回答
用div包装单元格的内容,你可以做任何你想做的事情,但你必须将每个单元格包装在一列中,以获得统一的效果。例如,要获得更宽的左右边距:
因此CSS将是,
div.cell加宽器{边距:0px 15px 0px 15像素;}时差{填充:0px;}<table border=“0”><tr><td class=“紧”><div class=“cellwider”>我的内容</div></td></tr></table>
是的,这很麻烦。是的,它适用于Internet Explorer。事实上,我只在Internet Explorer上测试过这一点,因为这是我们在工作中允许使用的全部功能。
其他回答
根据我从W3C分类中了解到的,<table>是用于“仅”显示数据的。
基于此,我发现创建一个带有背景和所有背景的<div>并使用position:absolute创建一个数据浮动在上面的表要容易得多;背景:透明;。。。
它适用于Chrome、Internet Explorer(6及更高版本)和Mozilla Firefox(2及更高)。
边距用于(或意味着)在容器元素之间创建分隔符,如<table>、<div>和<form>,而不是<tr>、<td>、<span>或<input>。将其用于容器元素以外的任何其他内容都会使您忙于调整网站以适应未来的浏览器更新。
此样式用于表格的完全重置-单元格填充、单元格间距和边框。
我的reset.css文件中有这样的样式:
table{
border:0; /* Replace border */
border-spacing: 0px; /* Replace cellspacing */
border-collapse: collapse; /* Patch for Internet Explorer 6 and Internet Explorer 7 */
}
table td{
padding: 0px; /* Replace cellpadding */
}
此外,如果您希望cellspacing=“0”,请不要忘记在表的样式表中添加边框折叠:折叠。
据我所知,在表格单元格上设置边距实际上没有任何效果。单元格间距的真正CSS等价物是边框间距,但它在Internet Explorer中不起作用。
您可以使用border-collapse:collapse将单元格间距可靠地设置为0,如前所述,但对于任何其他值,我认为唯一的跨浏览器方法是继续使用cellspacing属性。
table
{
border-collapse: collapse; /* 'cellspacing' equivalent */
}
table td, table th
{
padding: 0; /* 'cellpadding' equivalent */
}