Question

以下页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<STYLE type="text/css"> 
tr.cccc {
visibility: collapse;
}
</STYLE>
<BODY>
<TABLE border="1">
<TR class="cccc">
<TD>one</TD>
</TR>
</TABLE>
</BODY>
</HTML>

仅适用于Firefox。 IE始终显示行，Chrome隐藏行但显示其垂直空间。那么，如何只使用CSS完全隐藏一行呢？

Answer 1

使用
display：none

而不是 可见性：崩溃

我可以隐藏IE6中的dojo树网格摘要行。谷歌浏览器

Answer 2

visibility: collapse

在IE8中实施

http://msdn.microsoft.com/en-us/library/ms531180%28VS.85%29.aspx

Answer 3

visibility: collapse在IE中不起作用。 Source似乎您需要使用hidden代替IE。有关详细信息，请参阅链接页面。

但是，规范明确指出，在列的情况下，只有collapse是有效值。只有Firefox支持折叠。由于Explorer Windows支持列上的所有样式声明，因此它还支持visibility：hidden。

此外，为构造提供完整的HTML结构并没有什么坏处：

<!DOCTYPE html PUBLIC 
 "-//W3C//DTD XHTML 1.0 Transitional//EN"  
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML>
<HEAD>
<STYLE type="text/css"> 
 ....
</STYLE>
</HEAD>
...

Answer 4

它已过时，但您可以使用innerHTML重写您想要“消失”的部分。

Answer 5

似乎visibility: collapse似乎也可以在IE中使用。我正在使用它，它在IE和Firefox中都有效。除了这两个浏览器之外，别了解其他浏览器。

我做了以下事情：

HTML：

<table class="intValidationTable">

<tr class="rangeTR" style="visibility: collapse;">

<tr class="listTR" style="visibility: collapse;">

Javascript + Jquery：

var rows = $('table.intValidationTable tr');

var rangeTR = rows.filter('.rangeTR');

var listTR = rows.filter('.listTR');

rangeTR.css("visibility", "visible");

listTR.css("visibility", "collapse");

这应该有效！

Answer 6

可见性：崩溃；对我来说，在tr和td中只是隐藏数据，但在2020年仍会在Safari中占用垂直空间。在chrome中可以正常工作（行和列的宽度仍然可以，但垂直空间已消失）

替代可见性：崩溃无法在IE和Chrome上运行

6 个答案: