从新认识visibility

原先只是记住了display:none不点位，visibility:hidden要占位显示。

今天看到table中，列样式支持四个css的表格样式以外的属性：border width background visibility。
言外之意就是就像给表格的<tr>上加样式控制整行同样，
给表格的<col>标签能够添加上面四个属性，在col上增长样式控制整列样式。但要记住优先级是：cell ->row ->col ->table。

visibility 的4个可选值: visible, hidden, collapse, and inherit。 下面是我总结的：

值	普通元素	表格<col>元素
visible	显示占位	无效！正常显示
hidden	隐藏点位	无效！正常显示
collapse	同hidden	隐藏。合并格会剪切
inherit	默认，未研究	未研究

 

测试:

一、div和table元素设置collapse时，在edge中，彻底隐藏的！
二、表格的col元素设置collapse时，该列隐藏，表宽度自动减小。
对于若是该列有横向合并 单元格，合并格宽度自动减小，
但“内容不会自动再布局，而是直接剪去相应宽度。clipped!"

什么意思呢？ 假如是合并格原先是居中的，collapse其中的某一列后，合并格像从右边直接剪去列宽度，就是文字再也不重排，不会居中，文字若是长的话，直接会tgtg截断！

三、col元素设置display:none。我的理解，它不去影响表格的列样式，只是让自身的col标签没有。

什么意思呢？假如一组col标签控制表格每一个列宽度，若是设置其中一个col为display:none时，并不会让相应列隐藏，而只是让当前的col标签失效，从然后面的col影响