Css 固定表格布局的样式（&a）；固定宽度列+；科尔斯潘

我有下面的布局

<style>
   table { width: 200px; white-space: nowrap; table-layout: fixed; }
   .a { width:10px; overflow: hidden; text-overflow: ellipsis }
   .b { width:190px; overflow: hidden; text-overflow: ellipsis }
</style>

<table border="1" style="">
    <tr>         
        <td colspan="2">Some content header goes in here</td>
    </tr>
    <tr>
        <td class="a">This cells has more content</td>
        <td class="b">Less content here</td>
    </tr>
</table>

表{宽度：200px；空白：nowrap；表布局：固定；}
.a{宽度：10px；溢出：隐藏；文本溢出：省略号}
.b{宽度：190px；溢出：隐藏；文本溢出：省略号}
这里有一些内容头
这个单元格有更多的内容
这里的内容更少

我试图设置一个固定的表格布局，并且在每列上都有一个固定的宽度，但是，由于我在固定列上方有

colspan

，因此我无法设置宽度。我怎样才能做到这一点

您可以在打开的

标记后添加两个标记，并在这些标记上设置宽度：

<style>
   table { width: 200px; white-space: nowrap; table-layout: fixed; }
   .a { overflow: hidden; text-overflow: ellipsis }
   .b { overflow: hidden; text-overflow: ellipsis }
   .cola { width: 10px; }
   .colb { width: 190px; }
</style>

<table border="1" style="">
    <col class="cola" />
    <col class="colb" />
    <tr>         
        <td colspan="2">Some content header goes in here</td>
    </tr>
    <tr>
        <td class="a">This cells has more content</td>
        <td class="b">Less content here</td>
    </tr>
</table>

表{宽度：200px；空白：nowrap；表布局：固定；}
.a{溢出：隐藏；文本溢出：省略号}
.b{溢出：隐藏；文本溢出：省略号}
.cola{宽度：10px；}
.colb{宽度：190px；}
这里有一些内容头
这个单元格有更多的内容
这里的内容更少

应该关闭

col

，这取决于您的DOCTYPE。这是非常有效的HTML5，这正是我这些天想要的。嗯。。。出于某种原因，我认为它们应该在XHTML中自动关闭，也可以在HTML中自动关闭（即，不要用

关闭），但我不同意这一点<代码>和

是可选的！无论如何，要用更少的HTML标记来实现这一点？我试图在现有网站中实现这一点，因此必须返回数百页并插入

标记

和

在HTML4和HTML5中仍然有效，这将是一个问题，但是

上的许多属性（例如

）在HTML4中被弃用，在HTML5中被废弃。不过，上面的语法在HTML4和HTML5中是有效的。看见