HTML 表格单元格 - 隐藏一个单元格

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3643092/
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-29 04:22:47  来源:igfitidea点击:

HTML Table Cells - Hiding One Cell

htmlcss

提问by tonyf

I have a html table that I have setup in a 3 rows by 2 column formation. So basically have 6 cells that are currently being displayed to the suer.

我有一个 html 表,我设置了 3 行 x 2 列。所以基本上有 6 个单元格当前正在显示给 suer。

My question is an unsure how to do, is that I only want to use 5 cells only visible to the user so would like to somehow remove cell position (3,2), so that it doesn't show any borders at all for that cell alone - can this be done, if so, how?

我的问题是不确定该怎么做,是我只想使用仅对用户可见的 5 个单元格,所以想以某种方式删除单元格位置 (3,2),以便它根本不显示任何边框单独的单元格 - 可以这样做吗,如果可以,怎么做?

Thanks.

谢谢。

采纳答案by Moin Zaman

look up the css properties border-collapseand empty-cells

查找 css 属性border-collapseempty-cells

Ref: http://www.quirksmode.org/css/tables.html

参考:http: //www.quirksmode.org/css/tables.html

Scroll down the page and look at the examples of empty-cells:hidealso check the browser compatibility chart at the top of the page.

向下滚动页面并查看页面empty-cells:hide顶部的浏览器兼容性图表的示例。

回答by user1343331

Try setting the CSS on the cell you want to hide to visbility: hidden;- that will not show the cell, but it'll still take up space. See the reference: http://www.w3schools.com/cssref/pr_class_visibility.asp

尝试在要隐藏的单元格上设置 CSS visbility: hidden;- 这不会显示单元格,但它仍会占用空间。见参考:http: //www.w3schools.com/cssref/pr_class_visibility.asp

回答by Mike

Let's assume you have cell at 3,2 as

假设您在 3,2 处有单元格

<td id="cell32">cell data</td>

When you want to hide it, then execute

当你想隐藏它时,然后执行

cell32 = document.getElementById("cell32");
cell32.style.display = "none";

However if you hide a middle cell, your other cells will shift left. To preserve table structure, you need to replace hidden cell with a special cell having empty (&nbsp;)content and no borders as you want.

但是,如果您隐藏中间的单元格,则其他单元格将向左移动。要保留表格结构,您需要根据需要将隐藏单元格替换为具有empty (&nbsp;)内容且没有边框的特殊单元格。

回答by Kiran Maniya

use cssproperty empty-cellsto remove unwanted/empty cells from table. When the empty-cells: hideused, the empty cells will be completely erased from the table view as shown,

使用css属性empty-cells从表中删除不需要的/空单元格。当empty-cells: hide使用时,空单元格将被完全从表视图如图所示擦除,

table

桌子

moreover, when the empty-cells: hideand still you want to display some of the cells which are empty, you can override the behavior by using &nbsp;in empty cells. for more information, you can visit MDN

此外,当empty-cells: hide您仍然想要显示一些空单元格时,您可以通过&nbsp;在空单元格中使用来覆盖该行为。有关更多信息,您可以访问MDN