CSS使用样式table-layout:fixed后单元格宽度设置的解决

来源：懂视网责编：小采时间：2020-11-27 18:50:44

CSS使用样式table-layout:fixed后单元格宽度设置的解决

CSS使用样式table-layout:fixed后单元格宽度设置的解决:下面的代码，是想在使用 table-layout:fixed 后，本意是想让单元格的宽度保持有效，在 IE 中测试，宽度设置是无效的：<table style="table-layout:fixed;width:200px" border="1" cellspacing

推荐度：

点击下载本文 文档为doc格式

导读CSS使用样式table-layout:fixed后单元格宽度设置的解决:下面的代码，是想在使用 table-layout:fixed 后，本意是想让单元格的宽度保持有效，在 IE 中测试，宽度设置是无效的：<table style="table-layout:fixed;width:200px" border="1" cellspacing

下面的代码，是想在使用 table-layout:fixed 后，本意是想让单元格的宽度保持有效，在 IE 中测试，宽度设置是无效的：

<table style="table-layout:fixed;width:200px" border="1" cellspacing="1" cellpadding="1">
 <tr>
 <td style="width:100px">1</td>
 <td colspan="2">2</td>
 </tr>
 <tr>
 <td>1.1</td>
 <td style="width:80px">2.1</td>
 <td style="width:20px">2.2</td>
 </tr>
</table>

下面给出解决方法，table-layout:fixed 样式使用后，除第一行外，剩下的行中单元格的宽度，是按照第一行中的单元格宽度设定的，既然这样，我们就设置一个隐藏的行来规定宽度：

<table style="table-layout:fixed;width:200px" border="1" cellspacing="1" cellpadding="1">
<tr style="display:none">
 <td style="width:100px"></td>
 <td style="width:80px"></td>
 <td style="width:20px"></td>
</tr>
<tr>
 <td>1</td>
 <td colspan="2">2</td>
</tr>
<tr>
 <td>1.1</td>
 <td>2.1</td>
 <td>2.2</td>
</tr>
</table>

这个方法，在IE6,IE7，IE8中都可以正确地显示，但在非IE中，是没起作用的。下面给出另外一种方法：

<style>
td{border:1px solid red;}
</style>
<table style="table-layout:fixed;width:200px" border="0" cellspacing="1" cellpadding="1">
<tr style="height:0;">
 <th style="width:100px"></th>
 <th style="width:80px"></th>
 <th style="width:20px"></th>
</tr>
<tr>
 <td>1</td>
 <td colspan="2">2</td>
</tr>
<tr>
 <td>1.1</td>
 <td>2.1</td>
 <td>2.2</td>
</tr>
</table>

CSS使用样式table-layout:fixed后单元格宽度设置的解决

推荐度：

点击下载本文 文档为doc格式

标签：设置使用单元格

热门焦点

CSS使用样式table-layout:fixed后单元格宽度设置的解决

CSS使用样式table-layout:fixed后单元格宽度设置的解决

CSS使用样式table-layout:fixed后单元格宽度设置的解决

最新推荐

猜你喜欢

热门推荐