找了大半个小时,网上都是千变一律的添加<colgroup>标签,但是和我试了,在我这里没效果。
无意中搜索colspan标签,来到w3c,查看colspan效果,发现这里表头合并了,但是内容的td宽度并没有失效。
仔细看了下发现问题所在
w3c代码:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>W3C</title> </head> <body> <table border="1"> <tr> <th colspan="2">Monthly Savings</th> </tr> <tr> <td width="200">January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </table> </body> </html>
我的代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>xxxxx</title> </head> <body> <table border="1"> <thead> <tr> <th colspan="2">Monthly Savings</th> </tr> </thead> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td width="200">February</td> <td>$80</td> </tr> </tbody> </table> </body> </html>
仔细看,唯一的区别就是我的代码多了<thead>和<tbody>标签,去掉了<thead>标签,td的宽度就生效了,至于到底什么原因就不清楚了
如果table加了table-layout: fixed;这个属性,要去掉