html解决table设置宽度无效的问题

2023-12-01 0 186

如果对table设置table-layer:fixed样式后,发现表格中有一行合并过,其它没有合并的行的列宽会平均化,对列宽的设置会失效。

解决方法:

在tbody前面加

<col style="width: 100px;"/>
<col>
<col style="width: 100px;"/>
<col style="width: 100px;"/>
<col style="width: 100px;"/>

.detail {
padding-bottom: 50px;
margin-top: 80px;
}

.detail_table {
table-layout:fixed;/*列宽由表格宽度和列宽度设定。*/
margin: auto;/*table居中*/
text-align: center;
border: 1px solid #804040;
border-collapse: collapse;
}

.detail_table th {
padding: 26px;;
}

.detail_table td {
border: 1px solid #804040;
padding-top: 16px;
padding-bottom: 16px;
}

.special {
text-align: left;
padding-left: 20px;
}

<div class="detail">

<table class="detail_table">

<thead>
<th colspan="5">选择的选项明细</th>
</thead>
<!–写的话就按照你写的宽度,但是如果你写的宽度占不满table它会按照你给的尺寸的比例平分至每个td–>
<!–现在这么写就是四列是100px,没给数据的那一列占剩下的全部–>
<col style="width: 100px;"/>
<col>
<col style="width: 100px;"/>
<col style="width: 100px;"/>
<col style="width: 100px;"/>

<tbody>

<tr>
<td>
序号
</td>
<td>
症状
</td>
<td>
符合
</td>
<td>
不符合
</td>
<td>
不确定
</td>
</tr>

<?php $i = 1; ?>

<?php foreach ($test as $item): ?>
<!–拿到选择项–>
<?php $temp = $this->session->userdata(\’b\’ . $i) ?>

<tr>

<td>
<?php echo $i; ?>
</td>

<td>
<?php echo $item; ?>
</td>

<td>
<?php if ($temp == 1): ?>√<?php endif ?>
</td>
<td>
<?php if ($temp == 2): ?>√<?php endif ?>
</td>

<td>
<?php if ($temp == 3): ?>√<?php endif ?>
</td>

</tr>

<?php $i++; ?>

<?php endforeach; ?>

</tbody>

</table>

</div>

到此这篇关于html解决table设置宽度无效的问题的文章就介绍到这了,更多相关table设置宽度无效内容请搜索悠久资源网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持悠久资源网!

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

悠久资源 HTML/Xhtml html解决table设置宽度无效的问题 https://www.u-9.cn/sheji/html/9464.html

常见问题

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务