Tom*_*Tom 87 html css margin cell css-tables
在我的HTML文档中,我有一个包含两列和多行的表.如何用css增加第一列和第二列之间的空间?我试过申请"保证金权利:10px;" 到左侧的每个单元格,但没有效果.
rav*_*avi 149
一句警告:尽管padding-right可能会解决您的特定(视觉)问题,但这不是在表格单元格之间添加间距的正确方法.什么padding-right确实的细胞类似于它做什么其他大多数元素:它增加了空间中的单元格.如果单元格没有边框或背景颜色或其他让游戏离开的东西,这可以模仿在单元格之间设置空间的效果,但不能.
正如有人指出的那样,表格单元格会忽略边距规范:
内部表元素生成带有内容和边框的矩形框.细胞也有填充物.内部表元素没有边距.
那么"正确"的方式是什么?如果您要替换cellspacing表的属性,则border-spacing(已border-collapse禁用)是替换.但是,如果需要每单元格"边距",我不确定如何使用CSS正确实现.我能想到的唯一的黑客就是padding如上所述使用,避免细胞的任何样式(背景颜色,边框等),而是在单元格内使用容器DIV来实现这样的样式.
我不是CSS专家,所以我在上面可能是错的(这将是很好的知道!我也想要一个表格单元边缘CSS解决方案).
干杯!
rom*_*n m 84
将此应用于您的第一个<td>:
padding-right:10px;
Run Code Online (Sandbox Code Playgroud)
HTML示例:
<table>
<tr>
<td style="padding-right:10px">data</td>
<td>more data</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
小智 25
如果你不能使用填充(例如你在td中有边框)试试这个
table {
border-collapse: separate;
border-spacing: 2px;
}
Run Code Online (Sandbox Code Playgroud)
小智 14
我意识到这是相当迟钝的,但是对于记录,你也可以使用CSS选择器来做到这一点(不需要内联样式.)这个CSS将填充应用于每一行的第一列:
table > tr > td:first-child { padding-right:10px }
Run Code Online (Sandbox Code Playgroud)
这将是你的HTML,没有CSS!:
<table><tr><td>data</td><td>more data</td></tr></table>
Run Code Online (Sandbox Code Playgroud)
这样可以实现更优雅的标记,尤其是在需要使用CSS进行大量特定格式化的情况下.
小智 14
不幸的是,在单个单元格上边距不起作用,但是你可以在两个单元格之间添加额外的列,你想在它们之间放置一个空格......另一种选择是使用与背景颜色相同的边框...
小智 9
你可以这样做:
<html>
<table>
<tr>
<td>one</td>
<td width="10px"></td>
<td>two</td>
</tr>
</table>
</html>
Run Code Online (Sandbox Code Playgroud)
不需要CSS :)这个10px是你的空间.
试试padding-right.你不被允许放在margin牢房之间.
<table>
<tr>
<td style="padding-right: 10px;">one</td>
<td>two</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
336816 次 |
| 最近记录: |