table在布局中是个很奇怪的元素,它是内联的,也就是说,首尾没有换行,可是和span等内联元素不同的是,它是可以设长宽,也可以设边距的。也就是说,它集合了两者的特点于一身。这种元素很有趣,类似的还有input标签和img标签。呵,我称它们为隐藏的display属性。在做特殊样式的按钮的时候,我总是喜欢把input设背景,而不用a标签设背景,原因就在于a标签如果要设背景,必须改成块级元素,而块级元素首尾会有换行。众所周知,IE下,关于display只有none,inline,block这几种选择。在块级元素竖直居中的问题中,FF下,我们可以用display:teble-cell来控制它,再设vertical-align:middle;就可以了。可是,IE下不行。原因就是IE下display的类型太少。有趣的是,如果我们直接就用table来布局,不用display:table-cell的话,vertical-align:middle;就有效果了。也就是说,IE下其实还是内置了对table-cell的解释引擎,只是不提供css来改变,而只针对table标签采用。
今天在做一个效果时,遇到一个问题。对于一个报表型的数据,我用了table来布局,然后对其中的几个tr设了display:none;隐藏起来。这里都没有问题。再然后,我通过js让tr显示出来,习惯性地我就设了display:block;结果IE下没有问题,而FF下显示就出了状况。用firebug看了下,FF下设了display:block的tr一点高度也没有,就像是用了float一样,试着设了下display:inline和display:inline-block;还是不行。最后,用了一个display:table-row;就显示正常了。这些属性平时很少有机会用得上,感叹一下FF对css的引擎丰富程度 。
关于table的display问题
转载本文章为转载内容,我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题,欢迎原作者联系我们进行内容更正或删除文章。
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
关于LVGL界面切换的问题
LVGL界面切换问题解决
界面切换 线程安全 键值 -
display:table的几个用法
其是DIV+CSS很不方便解决的问题,比如以下两种情况:一、父元素宽度固定,想让若干个子元素平分宽度通常的做法是...
display:table的几个用法 学习 -
关于删除交换机mac table映射的问题
Switch#show mac-address-table Mac Address Table-------------------------------------------Vlan Mac Address &
mac static pvlan mac-address-table