Html 表格多列宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17752471/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Table multiple column widths
提问by Anonymous
Here's the code:
这是代码：
<table>
<col style="width:10px"><col style="width:20px"><col style="width:30px">
<td>
....
which defines three columns of different widths. Is there any way to define CSS layout for whole table - all 3 columns - in one single entry, so that I can write:
它定义了三列不同宽度的列。有什么方法可以在一个条目中为整个表格（所有 3 列）定义 CSS 布局，以便我可以编写：
<table class="cols3">
...
and this cols3 class define that this table has 3 columns of predefined width?
这个 cols3 类定义了这个表有 3 列的预定义宽度？
回答by Jnatalzia
You can use the nth-childselector on the child columns, so your css might look like this:
您可以nth-child在子列上使用选择器，因此您的 css 可能如下所示：
.cols3 col:nth-child(1){width:10px;}
.cols3 col:nth-child(2){width:20px;}
.cols3 col:nth-child(3){width:30px;}
Be aware that with the nth-child selector, 1 is what is used to get the first child element, not the typical 0.
请注意，对于 nth-child 选择器，1 用于获取第一个子元素，而不是典型的 0。
回答by fditz
In your case with 3 columns try using CSS selectors:
在您有 3 列的情况下，请尝试使用 CSS 选择器：
table.cols3 col:first-child{
/* style for first*/
}
table.cols3:last-child{
/*style of last child (3rd column)*/
}
table.cols3 {
/*style for middle columns)*/
}
for more selectors (and examples) check here
有关更多选择器（和示例），请查看此处
