Html 如果所有单元格都为空,是否会显示表格行?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/919747/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-28 23:48:56  来源:igfitidea点击:

Will a table row be displayed if all its cells are empty?

htmlhtml-table

提问by User

I have an empty table row just for separation between rows.

我有一个空表行只是为了行之间的分隔。

<tr>
  <td colspan="5"></td>
</tr>

It's rendered in IE, FF, Opera and Safari. The question is, whether I should put some content inside of it or it is okay to leave it as it is?

它在 IE、FF、Opera 和 Safari 中呈现。问题是,我是应该在其中放入一些内容还是可以保持原样?

Like:

喜欢:

<tr>
  <td colspan="5">&nbsp;</td>
</tr>

回答by Lennart Koopmann

Well you could put an &nbsp;as column content to make sure the rows are displayed. The better way is to use CSS for spacing though.

好吧,您可以放置​​一个&nbsp;as 列内容以确保显示行。更好的方法是使用 CSS 作为间距。

回答by Jason Musgrove

Semantically, does the empty row serve a purpose, or is it purely for layout? If the latter, it may be worth considering dropping the empty row, and providing the separation via CSS. E.g.

从语义上讲,空行是有用途的,还是纯粹是为了布局?如果是后者,可能值得考虑删除空行,并通过 CSS 提供分隔。例如

<tr class="separate-below">
    <td>Data before separater</td><td>More Data</td>...
</tr>
<tr>
    <td>Data after separater</td><td>More Data</td>...
</tr>

With the following in the stylesheet:

在样式表中包含以下内容:

TR.separate-below TD,TR.separate-below TH {
    border-bottom: 1em solid white; /* use the background colour of a cell here */
}

Alternatively, you can use multiple <tbody> elements to group blocks of rows together (adding rules="groups" to the table element causes <tbody> elements to gain a horizontal border at top and bottom, and <colgroup> element to gain a border to their left and right):

或者,您可以使用多个 <tbody> 元素将行块组合在一起(将 rules="groups" 添加到 table 元素会导致 <tbody> 元素在顶部和底部获得水平边框,而 <colgroup> 元素将获得一个边框的左右):

<table rules="groups">
<thead>
    <tr><th>Header</th><th>Header</th>...</tr>
</thead>
<tbody>
    <tr><td>Data</td><td>Data</td>...</tr>
    <tr><td>Data</td><td>Data</td>...</tr>
    ...
</tbody>
<tbody>
    <tr><td>Data</td><td>Data</td>...</tr>
    ...
</tbody>
...
</table>

回答by Jo?o Guilherme

As you can see in this examplefrom W3Schools using the &nbsp;is the best way to do what you want.

正如您在W3Schools 的这个示例中所看到的,使用&nbsp;is the best way to do what you want。

回答by knittl

if you want to put content inside, i would use a no-breaking-space: &nbsp;, rather than a normal blank

如果你想把内容放在里面,我会使用一个不间断空格:&nbsp;,而不是一个普通的空白

回答by Dariusz Sikorski

This is a very old question, but if somebody still needs a solution (problem exists with display: table-cellor table-row elements)

这是一个非常古老的问题,但如果有人仍然需要解决方案(问题存在于display: table-celltable-row elements

here's the solution:

这是解决方案:

.emptyElement:after{
  content: "
td:empty:after, th:empty:after {
  content: "
table { empty-cells:show; }
a0"; }
a0"; }

回答by Jason Foglia

I wanted to add my solution which is a modification of @Dariusz Sikorski solution.

我想添加我的解决方案,这是对@Dariusz Sikorski 解决方案的修改。

##代码##

回答by Karl

You may have already tried this but if your trying to add some space in between rows have you tried adding some padding.

您可能已经尝试过这个,但是如果您尝试在行之间添加一些空间,您是否尝试过添加一些填充。

CELLSPACING=Length (spacing between cells)

CELLSPACING=长度(单元格之间的间距)

CELLPADDING=Length (spacing within cells)

CELLPADDING=长度(单元格内的间距)

Karl

卡尔

回答by Jon Winstanley

To ensure that empty cells are displayed the following CSS can be used:

为了确保显示空单元格,可以使用以下 CSS:

##代码##

回答by Paul Kozlovitch

You can use multiple tbodytags to group table rows. It's totally valid and more semantic.

您可以使用多个tbody标签对表格行进行分组。它完全有效且更具语义。