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

最新推荐文章于 2019-09-26 08:24:08 发布
最新推荐文章于 2019-09-26 08:24:08 发布
阅读量211 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： CSS 文章标签： Firefox JavaScript ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/iteye_20499/article/details/81963340
本文记录了一次使用Firefox浏览器进行页面测试时遇到的问题：通过JavaScript控制表格行（TR）显示隐藏时，某些情况下TD的colspan属性失效。文中提供了问题解决方法，并探讨可能的原因。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

今天用firefox测试页面的时候，发现用javascript控制 tr 的显示隐藏时，当把tr的显示由“display:none”改为“display:block”时，该tr下的td内容合并到了第一个td里，也就是 说，原先在td中设置的colspan属性无效了。


由于display属性设置为空时，默认为显示，因此将“display:block”改为“display:”就好了，解决了该问题。

 

但具体是什么原因仍然不太清楚，有待以后研究。

怎么将两个css合并单元格,css table之合并单元格
weixin_39903538的博客
08-03 4378
colspan 是合并列，rowspan是合并行，合并行的时候，比如rowspan="2"，它的下一行tr会少一列；合并列的时候 colspan="2"，此行的列会少一列我是占位符我是占位符我是占位符我是占位符我是占位符我是占位符我是占位符我是占位符我是占位符效果css3斜线表头.biaoTou {border-top: 200px #199fff solid; /*上边框宽度等于表格第一行行高*...
javascript 控制 table tr display block 显示模式时，只对第一个单元格有效
weixin_30920091的博客
01-15 89
(本文来自 http://www.wilson-loo.com/wordpress/archives/140) 有一个简单的 table： <table> <tr> <th>编号</th> <th>类型</th> <th>详细</th> <th>创建时间&...
display的32种写法
lanwuying的专栏
09-26 5889
转自：display的32种写法 你知道『回』字有四种写法，但你知道display有32种写法吗？今天我们一一道来，让你一次性完全掌握display，从此再也不用对它发愁。 从大的分类来讲，display的32种写法可以分为6个大类，再加上1个全局类，一共是7大类 1. 外部值 所谓外部值，就是说这些值只会直接影响一个元素的外部表现，而不影响元素里面的儿子级孙子级元素的表现。 1.1 dis...
table中tr的display:block显示布局错乱问题
11-21
table中tr的display:block显示布局错乱问题
在Table中多行中，每一行独立两个td的input输入后在第三个td的input进行相乘
06-18
我们希望两个都为空时显示0（或者空）？但通常，没有输入时，结果应该是空或者0。我们可以这样处理：如果所有输入框都为空，那么显示空字符串，否则显示乘积。但是用户可能希望一开始是空，输入后才开始计算。所以...
jsp页面有多个表格，css已经用了display: none和block，隐藏或显示单个表格，页面只会一个表格，默认显示第一个表格，在第二个表格点击查询用window.location.href重新打开页面，怎么让他定位到第二个表格
07-03
我们面临的需求是：在JSP页面中有多个表格，通过display属性控制显示和隐藏（默认显示第一个表格）。当点击第二个表格的查询按钮时，使用`window.location.href`重新加载页面，并希望页面加载后自动定位到第二个表格...
一个主div中的两个子div如何设置间距
07-09
用户提供的引用[1]是关于设置一个div显示在另一个div上层的示例，但用户当前的问题是关于设置两个子div之间的间距，所以我们需要调整方向。 常见的设置子元素间距的方法有： 1. 使用margin属性：为第一个子div设置...
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>太阳系行星数据</title> <link href="minimal-table.css" rel="stylesheet"> </head> <body> <h1>太阳系行星数据</h1> <header> <table id="table"> <caption> 太阳系中行星的一些数据。（资料取自<a href="http://nssdc.gsfc.nasa.gov/planetary/factsheet/">NASA 行星数据 - 公制</a>，图片取自<a href="https://www.nasa.gov/multimedia/imagegallery/">NASA 照片库。</a>） </caption> <thead> <td colspan="2"></td> <th scope="col" class="name-column" >名字</th> <th scope="col">图片</th> <th scope="col">质量 (10<sup>24</sup>kg)</th> <th scope="col">直径 (km)</th> <th scope="col">密度 (kg/m<sup>3</sup>)</th> <th scope="col">重力 (m/s<sup>2</sup>)</th> <th scope="col">天长 (小时)</th> <th scope="col">平均温度 (°C)</th> <th scope="col">卫星数量</th> <th scope="col">备注</th> </thead> <tbody> <tr> <th colspan="2" rowspan="4" scope="rowgroup">类地行星</th> <th>水星</th> <td>0.330</td> <td>4879</td> <td>5427</td> <td>3.7</td> <td>4222.6</td> <td>57.9</td> <td>167</td> <td>0</td> <td>距太阳最近</td> </tr> <tr> <th>金星</th> <td>4.87</td> <td>12104</td> <td>5243</td> <td>8.9</td> <td>2802.0</td> <td>108.2</td> <td>464</td> <td>0</td> <td></td> </tr> <tr> <th>地球</th> <td>5.97</td> <td>12756</td> <td>5514</td> <td>9.8</td> <td>24.0</td> <td>149.6</td> <td>15</td> <td>1</td> <td>我们的世界</td> </tr> <tr> <th>火星</th> <td>0.642</td> <td>6792</td> <td>3933</td> <td>3.7</td> <td>24.7</td> <td>227.9</td> <td>-65</td> <td>2</td> <td>红色星球</td> </tr> <tr> <th rowspan="4" scope="rowgroup">类木行星</thead> <th rowspan="2" scope="rowgroup">气巨星</th> <th>木星</th> <td>1898</td> <td>142984</td> <td>1326</td> <td>23.1</td> <td>9.9</td> <td>778.6</td> <td>-110</td> <td>67</td> <td>太阳系最大</td> </tr> <tr> <th>土星</th> <td>568</td> <td>120536</td> <td>687</td> <td>9.1</td> <td>10.7</td> <td>1433.5</td> <td>-140</td> <td>62</td> <td></td> </tr> <tr> <th rowspan="2" scope="rowgroup">冰巨星</th> <th>天王星</th> <td>86.8</td> <td>51118</td> <td>1271</td> <td>8.7</td> <td>17.2</td> <td>2872.5</td> <td>-195</td> <td>27</td> <td></td> </tr> <tr> <th>海王星</th> <td>102</td> <td>49528</td> <td>1631</td> <td>11.0</td> <td>16.1</td> <td>4495.1</td> <td>-200</td> <td>14</td> <td></td> </tr> <tr> <th colspan="2" scope="row">矮行星</th> <th>冥王星</th> <td>0.0146</td> <td>2370</td> <td>2095</td> <td>0.7</td> <td>153.3</td> <td>5906.4</td> <td>-225</td> <td>5</td> <td>2006年降格，但<a href="http://www.usatoday.com/story/tech/2014/10/02/pluto-planet-solar-system/16578959/">尚存争议</a></td> </tr> </tbody> </table> </body> </html> 这个是全部代码。我现在要在“名字”这一列添加一个整体的黑色边框应该怎么弄
08-06
方法2：如果方法1在某些浏览器中边框不显示，我们可以通过CSS为名字列的所有单元格（包括表头单元格）设置左右边框，并在第一行和最后一行设置上边框和下边框，以形成封闭的边框。 但是，我们也可以使用列组...
帮我封装一个上传组件，需要实现的功能是可以在table中使用，上传单图和多图，并且上传的图片可以预览，并且可以删除
07-17
我们被要求开发一个在表格中使用的文件上传组件，支持单图/多图上传，包含图片预览和删除功能。 根据引用[1]和[2]，我们可以知道： 1. 文件选择器可以使用，并设置multiple属性支持多选。 2. 需要自定义按钮样式...
tr的display属性出现td的colspan无效问题
殇沫流年的专栏
03-01 8906
tr的display属性设置在firefox和chrome中出现td的colspan无效问题     今天用firefox和chrome测试页面的时候，     发现用javascript控制 tr 的显示隐藏时，当把tr的显示由“display:none”改为“display:block”时，该tr下的td内容合并到了第一个td里，也就是说，原先在td中设置的cols
转载：为什么table里用了display：block；就和第一列宽度一样呢？
zhangfeng2124的专栏
07-21 857
转载于：http://blog.youkuaiyun.com/ljw_josie/article/details/70209264 在前端页面展示需要通过判断来显示 table标签内的东西，按照常理，对于某一单元行需要显示时，使用：display:block属性，不需要显示时使用display:none属性，而且这样做 在IE浏览器中显示正常，没有任何问题。 但是当用Firefox浏览时却出现
使用js给td添加边框,不同条件下tr和td的visibility以及display属性的应用
昊谦粑粑
06-01 4667
*********************使用js给td添加边框********************************* css设计如下： .td {  border-width: 1px 1px 1px 1px;  border-style: solid;  border-color: 8DB1A1; } 假设有个td这样定义：          
tr td分合并单元格
只作为个人备忘录
11-30 9855
ss
基于SSM的一线式酒店管理系统-su0v7503【附万字论文+PPT+包部署+录制讲解视频】.zip
最新发布
08-15
基于SSM的一线式酒店管理系统-su0v7503【附万字论文+PPT+包部署+录制讲解视频】.zip
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值