1. 最近在作项目的时候碰到一个问题,就是需要AJAX来交互显示<tr> </tr> 标签内的东西,按照常理,对于某一单元行需要显示时,使用:display:block属性,不需要显示时使用display:none属性,而且这样做 IE浏览器中显示正常,没有任何问题。
  2.  
  3. 但是当用Firefox浏览时却出现了布局错乱的问题,然后通FireBug去看了下源码,调试下了,发现是display:block属性搞的鬼。
  4.  
  5. 、当表格为多列的情况下,属性为"display:block"行的内容宽度仅与第一列宽度相同,也就是说无论你使colspan的属性值为多少,剩余列的空间都不进行解析。
  6. 、同一行反复的在"display:none;""display:block;"两个状态间切换时,表格的底部会持续的产生多余的空白空间以至于造成页面布局的扭曲。
  7.  
  8. 解决方法:
  9. 、用display:table-row属性来调试,发现者FireFox下正常了,但IE是不支持改属性的,怎么办呢?用JS来做判断,然后做兼容吧。
  10. 、另外一个很简单也很可行的方法,就是用 display:' ' 这个属性dispaly后面不加任何的东西,很奇怪,这样就兼容了FirefoxIE了。具体原因有待牛人分析。

table中tr的display属性在火狐中显示不正常,IE中显示正常的更多相关文章

  1. tr设置display属性时,在FF中td合并在第一个td中显示的问题

      今天用firefox测试页面的时候,发现用javascript控制 tr 的显示隐藏时,当把tr的显示由“display:none”改为“display:block”时,该tr下的td内容合并到了 ...

  2. 在table中tr的display:block在firefox下显示布局错乱问题

    [转自:] http://blog.csdn.net/sd2131512/article/details/4720345 按照常理,对于某一单元行需要显示时,使用:display:block属性,不需 ...

  3. tr的display属性出现td的colspan无效问题

    http://www.aichengxu.com/other/9262680.htm 今天在做项目的时候发现用javascript控制 tr 的显示隐藏时,当把tr的显示由“display:none” ...

  4. 对table的tr使用display:block显示colspan失效问题的解决

    qqqq <table> <tr> <td id="qqq" colspan="3" style="display:no ...

  5. CSS学习笔记05 display属性

    HTML标记一般分为块标记和行内标记两种类型,它们也称块元素和行内元素. 块元素 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属性,常用于网页布局和网页结构的搭建.并且块级 ...

  6. 前端,基础选择器,嵌套关系.display属性,盒模型

    基础选择器 1.统配选择器 控制html,body及body内跟显示相关的标签 *{ width:80px; height:80px; background-color:red; } 2.类选择器 以 ...

  7. 网络策略中使用的 VLAN 属性

    TechNet 库 Windows Server Windows Server 2008 R2 und Windows Server 2008 按类别提供的 Windows Server 内容 Win ...

  8. C++ //继承中的对象模型 //利用开发人员命令提示工具查看对象模型 //父类中所有非静态成员属性都会被 子类继承下去 //父类中私有成员属性 是被编译器给隐藏了 因此是访问不到 但是确实被继承下去了

    1 //继承方式 2 //语法:class 子类 :继承方式 父类 3 //继承方式 三种: 4 //1.公共继承 5 //2.保护继承 6 //3.私有继承 7 8 /* 9 #include &l ...

  9. 区别CSS中display:box;inline;none以及HTML中 <frame> 标签<table> 标签的 frame 属性

    区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...

随机推荐

  1. 【微信】1.微信小程序开发--入门

    开始开发微信小程序咯!! ============================= 1.找到官网API地址 https://developers.weixin.qq.com/miniprogram/ ...

  2. 管理 node 版本,选择 nvm 还是 n?

    来源:http://taobaofed.org/blog/2015/11/17/nvm-or-n/ 引子 我本机安装着 nvm,而 node 本来一直运行在 0.x 的老版本上.后来为了跑 ES6,我 ...

  3. C#中 protected internal 和 internal 的区别

    http://kudick.blog.163.com/blog/static/1666066320091055414453/ DoDo: protected: 爷爷有一张银行卡,爸爸可以用,儿子也可以 ...

  4. asp.net使用母版页以及Jquery和prototype要注意的问题

    在母版页中引用了js,css或者其他外部文件之后,子页面就不必再重新引用,否则可能出错 prototype.js和jquery.js冲突的解决方案: <script type="tex ...

  5. input 中 datetime-local 方法

    <input  type=" datetime-local "> 这个标签是H5新增的对象方法 能把现有的时间赋值给它 但是注意:必须是  yyyy-MM-ddTHH: ...

  6. Linux学习之二-Linux系统的目录结构

    Linux学习之二-Linux系统的目录结构 在Linux的根目录下,有很多的目录,但是需要记住,对于Linux而言,一切皆文件.因此此处的目录也是文件.用ls / 命令就能看到根目录下的各类不同的目 ...

  7. 转: 由socket的accept说开去

    from: http://ticktick.blog.51cto.com/823160/779866 今天与同学争执一个话题:由于socket的accept函数在有客户端连接的时候产生了新的socke ...

  8. HTML5 Canvas 六角光阑动态效果

    光阑是光具组件中光学元件的边缘.框架或特别设置的带孔屏障,本人实现了结构比较简单的六角光阑,效果有点像宇航员在徐徐张开的飞船舷窗中看到逐渐完整的地球,下面四张图可以感受一下. 当然看动态效果才能真正体 ...

  9. 性能测试之Tomcat优化

    1.Tomcat最大连接数等配置   Tomcat的server.xml中Context元素的以下参数都是什么意思? <Connector port="8080"maxThr ...

  10. 小猪的Git使用总结

    小猪的Git使用总结 文件夹 小猪的Git使用总结 安装配置与文档 下载安装 文档教程相关 概念 Git的四个组成部分 文件的几个状态 Git与SVN版本号版本号控制存储差异 每次Commit时仓库中 ...