gpt4 book ai didi

HTML 表格列宽 : combining fixed and variable widths

转载 作者:太空狗 更新时间:2023-10-29 13:30:46 25 4
gpt4 key购买 nike

我做了这样一张表:

<table style="width:1000px;">
<tr>
<td>aaa</td>
<td id="space"></td>
<td class="fixed-width">bbb</td>
<td class="fixed-width">ccc</td>
</tr>
</table>

我如何使用 CSS 使 b 和 c 列具有固定宽度,a 列只占用所需的空间,而空间列扩展以填充表格的其余部分?

最佳答案

我不是 CSS 大师,但没有办法做到这一点似乎是不对的。这似乎适用于 Firefox 和 IE7。我没有检查其他浏览器。

第一个 shrink-to-fit 设置(使用 CSS)为 0 宽度,因此它会缩小以适合内容。

第二个空格 设置(使用 CSS)宽度大于表格中的宽度。

最后两个定宽的宽度不在上。相反,它设置为 样式。这会强制列宽。

<!DOCTYPE html>
<html>
<head>
<title>cols</title>
<style type="text/css">
td.fixed-width {
width: 100px;
background-color:aqua
}
td.min-width {background-color:aqua}
td.space {border: thick blue solid}
</style>
</head>
<body style="width:1100px; font-family:sans-serif">
<table style="width:1000px;">
<col style="width:0"/>
<col style="width:1000px"/>
<col span="2" />
<tr>
<td class="min-width">aaa</td>
<td class="space"></td>
<td class="fixed-width">bbb</td>
<td class="fixed-width">ccc</td>
</tr>
<tr>
<td class="min-width">aaa asdfasdf asdfsad</td>
<td class="space"></td>
<td class="fixed-width">bbb fasdas</td>
<td class="fixed-width">ccc vdafgf asdf adfa a af</td>
</tr>
</table>
</body>
</html>

关于HTML 表格列宽 : combining fixed and variable widths,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8190909/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com