`
fanyulei2010
  • 浏览: 18349 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

使用tbody标签控制显示与隐藏后,宽度发生变化问题。

 
阅读更多

 

       在table中,使用tbody标签来控制多个tr行的显示与隐藏时,使用display:none,display:block开控制时,会发生tbody的宽度变为table的一半的情况。 

原因: 
        当 table 的 display 为 block 时,不论是否在 HTML 里显式地写了 tbody 标签,Firefox 解析出的 tbody 都不再和 table 等宽,而是适应表格行的宽度。 

解决方式: 
       在控制tbody的显示与隐藏时,使用"display='';display='none'"来控制,将display属性设置为空字符串时,会恢复原来的设置,不在需要手动控制宽度。  

 

分享到:
评论

相关推荐

    tbody标签的妙用 加速表格内容显示

    用TBODY这个标签可以控制表格分行下载,可以让其中的内容比网页中别的东东(如图片)先下载下来,这样可以让别人先看到网页的实质性的内容,不用等那么久了

    js tr控制下面的tbody隐藏和显示

    个问题弄了我几天没心思写程序,问了论坛很多网友才搞定的。

    HTML标签tbody的用法与说明

    tbody 标签表格主体(正文)。该标签用于组合 HTML 表格的主体内容。

    firefox TBODY 用js显示和隐藏时出现错位的解决方法

    于是在处理好需要显示的行后,另写了一个函数,先记录需要显示的行,然后将所有行的style.display都设置为”none”,最后再将需要显示的行依次显示出来。这样,IE和firefox的显示结果就一样了。 后来,我还是觉得这...

    bootstrap表格固定表头并且tbody部分添加滚动条

    bootstrap的tbody加竖向滚动条,而且当前表格的表头。bootstrap的tbody加竖向滚动条,而且当前表格的表头。bootstrap的tbody加竖向滚动条,而且当前表格的表头。

    tbody元素支持嵌套的注意方法

    function addMessage(messageID,userName,userCreateDate,articleCount,subject,body,creationDate,modifiedDate)  {  var br;  var row = document.createElement("tr");  var cell = document....

    table表格,让thead固定,tbody有滚动条,关键是都对齐的纯css写法

    table表格,让thead固定,tbody有滚动条,关键是都对齐的纯css写法。table表格,让thead固定,tbody有滚动条,关键是都对齐的纯css写法。table表格,让thead固定,tbody有滚动条,关键是都对齐的纯css写法。table...

    control_table:jquery+bootstrap 控制table中的th在浏览器滚动条滚动时,一直显示在tbody的上方

    jquery+bootstrap 控制table中的th在浏览器滚动条滚动时,一直显示在tbody的上方 这只是一个页面的content部分,header & footer并未添加 1.实际页面中,需要加上header的高度; 2.通过offset()获取th这一行所处的位置,...

    使用thead、tfoot、 tbody制作一个表格

    还有人很变态地用这三个标签做出标题能跟随表格,或者tbody固定高度,走出自动出现滚动条的功能。 复制代码代码如下:<title>thead、tfoot 以及 tbody标签</title> ”1″> <thead> <tr> 科目</th> 分数...

    CSS设置table下tbody的滚动条的实现

    主要介绍了CSS设置table下tbody的滚动条的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    html tbody 用法

    表格的分组显示(Structured Table) (IExplore Only) 1)按行分组 <thead> ... </thead> - 表的题头(Header) <tbody> ... </tbody> - 表的正文(Body) <tfoot> ... </tfoot> - 表的脚注(Footer) 例: <table> <...

    JS固定表头和左边列(最新源码)1.9

    1.5 增加了 显示/隐藏功能,修正了非IE浏览器下列宽错位问题 1.6 修正了当有合并单元格时,锁定单元格错位的问题,修正了表格行数较多时的性能问题 1.7 表格单元格可以不指定宽度(锁定时,取实际的单元格宽度...

    FixedTable.7z

    table固定左侧多列,画面中可对多个table进行固定,谷歌、ie都试过没问题;之前实在是网上找不到好的,就自己整合弄了一个,质量没的说,肯定胜过90%其他的;调用简单: 例子是:html+jquery+FixedTable.js $("#...

    html工作中表格<tbody>标签的使用技巧

    公司大部分的项目都是基于BS结构,UI设计阶段做WEB原型页面时要把各种交互效果实现出来,与真正的后台编程不同,就用JS前台编程来实现,让程序员编程前知道要做成什么样的效果就行了。

Global site tag (gtag.js) - Google Analytics