table 中 display为 block 时 tbody 失去宽度

一,要使 tbody 宽度正常,必须设置 display:table。或者更通用的变通是用 JavaScript 控制表格的显示隐藏时不直接调协此 table 的 display 属性,而是给 table 包裹一层 div,然后设置该 div 的display 属性为 block 或 none。

二,更简单的处理,不用给 table 外包括 div 了,只要在恢复显示时设置 display 属性为空字符串即可。

原文地址:https://www.cnblogs.com/oralig/p/10118247.html

时间: 2024-11-06 15:24:10

table 中 display为 block 时 tbody 失去宽度的相关文章

table中thead保持不动,tbody滚动(2)

如果table中的th和td都没有合并列,可以不设th和td宽度 #tblDataList{ height:600px;}#tblDataList thead { display:block;} #tblDataList tbody { display:block; height:600px; overflow-y:scroll;} #tblDataList thead tr { display:table; width:100%; table-layout:fixed;}#tblDataLis

table中thead保持不动,tbody滚动(3)

如果thead中需要合并列 #tblDataList thead {display:block;} #tblDataList tbody { display:block;height:600px; overflow-y:scroll;overflow-x: hidden;} #tblDataList thead tr { display:table; width:100%; table-layout:fixed;}#tblDataList tbody tr {display:table; wid

在table中<tr>的display:block显示布局错乱

当用谷歌浏览器时,在将表格table中的<tr>的display属性从none改为block时,或出现所有的td都不起作用,内容都集中在第一列里,然后在网上百度了一下,一下事原因分析和解决方法 1.当表格为多列的情况下,属性为"display:block"行的内容宽度仅与第一列宽度相同,也就是说无论你使colspan的属性值为多少,剩余列的空间都不进行解析.2.同一行反复的在"display:none;"与"display:block;&quo

css实现table中td单元格鼠标悬浮时显示更多内容

table中,td单元格无法显示下全部内容,需要在鼠标hover时显示全部内容. 正常显示样式: 鼠标hover时: html: <td>displayAddress<span class="tdtip">popAddress</span></td> css: td{ position:relative; z-index:2; } td:hover{ z-index:3; background:none; } td .tdtip { di

css中display常用属性详解之Block(一)

用了几年的css了,css中inline | block |inline-block|table|flex从来没有做过系统的整理和分析,网上的分析文章也很多,零散. 今天有空,就在这做一下整理分析 block 解释:指定对象为块元素(占据一定矩形空间,可以通过设置高度.宽度.内外边距等属性,来调整的这个矩形的样) 特点:1.处于常规流中时,如果width没有设置,会自动填充满父容器  2.可以应用margin/padding  3.在没有设置高度的情况下会扩展高度以包含常规流中的子元素  4.处

table中tr的display属性在火狐中显示不正常,IE中显示正常

最近在作项目的时候碰到一个问题,就是需要AJAX来交互显示<tr> </tr> 标签内的东西,按照常理,对于某一单元行需要显示时,使用:display:block属性,不需要显示时使用display:none属性,而且这样做 在IE浏览器中显示正常,没有任何问题. 但是当用Firefox浏览时却出现了布局错乱的问题,然后通FireBug去看了下源码,调试下了,发现是display:block属性搞的鬼. 1.当表格为多列的情况下,属性为"display:block&quo

table 中 thead tbody tfoot 加载顺序问题

这几个标记主要是用于提高table标签的加载以及显示的,说白了,就是分布加载.在传统的浏览器,在加载 时,是当所有的标签中元素都被下载后才会显示,当然这样的用户体验是不好的.再加入了这几个t打头的标签后,table就会分布的加载table中的元素,顺序依据写在table中的标签顺序进行. 为了让大表格(table)在下载的时候可以分段的显示,就是说在浏览器解析HTML时,table是作为一个整体解释的,使用TBODY可以优化显示.如果表格很长,用tbody分段,可以一部分一部分地显示,不用等整个

css中display设置为table、table-row、table-cell后的作用及其注意点

html: <div class="table"> <div class="row"> <div class="cell">内容内容内容内容内容内内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</div> <

OC中NSString和block的属性时copy,而不用retain

OC中NSString和block的属性时copy,而不用retain   而容器类使用retain NSString 为什么要使用copy,而不是retain 1.首先如果使用retain,只是引用计数+1,并没有生成新的对象,所以效率好 2.但是使用copy安全.因为NSString为NSMutableString 的基类,如果将NSMutableString 以retain的形式赋值给NSString后,后续修改NSMutableString会导致NSString内容的变化,这通常不是我们