HTML怎样让Table里的一个格子和同一行其他格子一样高 100
如下图所示：在Firefox中，需要将上图里面Option中的checkbox元素垂直对齐，但是这个元素所在的表格单元的高度与左边三个单元格不一样高，怎么样能设置这一行所...
如下图所示：
在Firefox中，需要将上图里面Option中的checkbox元素垂直对齐，但是这个元素所在的表格单元的高度与左边三个单元格不一样高，怎么样能设置这一行所有的单元格为同一高度？或者怎样能让这个checkbox元素在这一样垂直居中？不能指定tr的height属性，因为预先不知道表格中文本的最大长度。
HTML代码如下：
<!DOCTYPE html><html><head><style>#zTable{ border-collapse: collapse;}#zTable .titleRow{ width:350px; font-style:italic;font-weight:bold;text-align:center;}#zTable .dataRow{ border-top:1px solid gray;}#zTable .zTitle, #zTable .zSTitle, #zTable .zLink, #zTable .zOption{ text-align:center;}#zTable .zTitle{width:100px;}#zTable .zSTitle{width:80px;}#zTable .zLink{width:300px;}#zTable .zOption{width:50px;float:right;}</style></head><body><table id="zTable"><tbody><tr class="titleRow"><td class="zSTitle">Short Title</td><td class="zTitle">Title</td><td class="zLink">Link</td><td class="zOption">Option</td></tr></tbody><tbody><tr class="dataRow"><td class="zSTitle"></td><td class="zTitle">abc</td><td class="zLink">http://abc.net/aaaaaaaaaaaaaaaaaaaaa/bbbbbbbbbbbbbbbbbbbbbb/ccccccccccccccccccccccccc</td><td class="zOption"><input type="checkbox" style="height:100%"></td></tr></tbody></table></body></html> 展开
在Firefox中，需要将上图里面Option中的checkbox元素垂直对齐，但是这个元素所在的表格单元的高度与左边三个单元格不一样高，怎么样能设置这一行所有的单元格为同一高度？或者怎样能让这个checkbox元素在这一样垂直居中？不能指定tr的height属性，因为预先不知道表格中文本的最大长度。
HTML代码如下：
<!DOCTYPE html><html><head><style>#zTable{ border-collapse: collapse;}#zTable .titleRow{ width:350px; font-style:italic;font-weight:bold;text-align:center;}#zTable .dataRow{ border-top:1px solid gray;}#zTable .zTitle, #zTable .zSTitle, #zTable .zLink, #zTable .zOption{ text-align:center;}#zTable .zTitle{width:100px;}#zTable .zSTitle{width:80px;}#zTable .zLink{width:300px;}#zTable .zOption{width:50px;float:right;}</style></head><body><table id="zTable"><tbody><tr class="titleRow"><td class="zSTitle">Short Title</td><td class="zTitle">Title</td><td class="zLink">Link</td><td class="zOption">Option</td></tr></tbody><tbody><tr class="dataRow"><td class="zSTitle"></td><td class="zTitle">abc</td><td class="zLink">http://abc.net/aaaaaaaaaaaaaaaaaaaaa/bbbbbbbbbbbbbbbbbbbbbb/ccccccccccccccccccccccccc</td><td class="zOption"><input type="checkbox" style="height:100%"></td></tr></tbody></table></body></html> 展开
展开全部
1：<td style= "white-space:nowrap;overflow:hidden; "> 多出内容不换行自动隐藏
2：把td里的先放一个textbox文本框，td里的内容放在文本框里，再把文本框的四边border都设成无边框，和白色边框。不管内容有多长，都是文本框的长度，多出内容自动隐藏
2：把td里的先放一个textbox文本框，td里的内容放在文本框里，再把文本框的四边border都设成无边框，和白色边框。不管内容有多长，都是文本框的长度，多出内容自动隐藏
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
设置所在td的属性<td valign="middle"/>或者设置对应css样式
#zTable td{vertical-align:middle}
#zTable td{vertical-align:middle}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你所有的样式都没有定义高度
试试在tr或者td相关的样式里面定义高度，如height:4px
试试
试试在tr或者td相关的样式里面定义高度，如height:4px
试试
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
