本文舉例說明在不同瀏覽器對table中visibility屬性顯示的不同。

1. <table>
2. <thead>
3. <tr>
4. <th>th</th>
5. <th>th</th>
6. </tr>
7. </thead>
8. <tbody>
9. <tr>http://www.ynmxzx.com/rzjw/20160622/3739.html
10. <td>td</td>
11. <td>td</td>
12. </tr>
13. </tbody>
14. </table>

選取了Chrome、FireFox、Edge、IE11分別測試，下文所有圖片從左至右順序均如前所述。

1. table {
2. border-collapse: collapse;
3. }http://www.ynmxzx.com/rzjw/20160622/3740.html
4. th, td {
5. border: 1px solid black;
6. }
7. thead {
8. visibility: hidden;
9. }http://www.ynmxzx.com/rzjw/20160622/3741.html

顯示結果如下圖：

可以看出，Chrome把邊框隱藏了，但另外三者只隱藏了內容，未隱藏邊框。

1. th, td {
2. border: 1px solid black;
3. }
4. thead {
5. visibility: hidden;
6. }http://www.ynmxzx.com/rzjw/20160622/3742.html

四者顯示結果相同，如下圖：

1. table {
2. border-collapse: collapse;
3. }
4. th, td {
5. border: 1px solid black;
6. }http://www.ynmxzx.com/rzjw/20160622/3743.html
7. th {
8. visibility: hidden;
9. }

四者顯示結果與2.1節相同，如下圖：

1. th, td {
2. border: 1px solid black;
3. }http://www.ynmxzx.com/xbzx/20160622/3748.html
4. th {
5. visibility: hidden;
6. }http://www.ynmxzx.com/rzjw/20160622/3744.html

四者顯示與2.2節相同，如下圖：

1. table {
2. border-collapse: collapse;
3. }
4. th, td {
5. border: 1px solid black;
6. }http://www.ynmxzx.com/xbzx/20160622/3745.html
7. tr {
8. visibility: hidden;
9. }

顯示結果如下圖：

可以看出，Chrome與FrieFox將整個表格隱藏，而Edge與IE11未將邊框隱藏。

1. th, td {
2. border: 1px solid black;
3. }http://www.ynmxzx.com/xbzx/20160622/3746.html
4. tr {
5. visibility: hidden;
6. }http://www.ynmxzx.com/xbzx/20160622/3747.html

四者顯示結果相同，均將表格全部隱藏

在border-collapse: collapse;情況下，隱藏thead或th，Chrome可將thead部分全部隱藏，而FireFox、Edge與IE11只隱藏了thead部分的文字內容，未隱藏邊框。www.ynmxzx.com

無border-collapse屬性時，隱藏thead或th，四個瀏覽器均可以將thead部分全部隱藏。

上述兩個結果也適用於tbody相關元素。

在border-collapse: collapse;情況下，隱藏tr，Chrome與FireFox可將表格全部隱藏，而Edge與IE11只隱藏了表格的文字內容，未隱藏邊框。

無border-collapse屬性時，隱藏tr，四個瀏覽器均可以將表格全部隱藏。

若使不同瀏覽器顯示相同結果，可對th或td設定border: none;。

我並沒有找到產生上述結果的原因，只能認為是不同瀏覽器處理結果的不同。W3school上說若不規定!DOCTYPE，border-collaspe可能產生意想不到的結果，上述測試均有規定!DOCTYPE。