html table width 问题

[Alander]

遇到个问题，关于 html 中同时设置 table 元素的 table-layout: fixed; 和 width: 100%;的问题：

实际结果如下： 如果 .container { width: 600px }， 那么

1. 如果不设置 width 属性，则 table 的宽度就是 600px
2. 如果设置 table 的 width: 100%; 则 table 的宽度是 col 的宽度之和 1920px;

我的疑问是：

1. 这个 width: 100% 是怎么计算的？
2. 当 width: auto | 100% | 具体像素值; 遇上 table-layout: fixed | auto; 又是怎么计算宽度的？

有什么资料可以提供查阅吗？我现在只知道会有这样的效果，但是不知道为什么，找了挺久资料也没找到，有了解的大佬可以跟我指个路我去看看？

<style>
.container {
	width: 600px;
}
table {
    table-layout: fixed;
    width: 100%; // 这里切换是否设置宽度
}
</style>
<div class="container">
	<table class="table">
		<col style="width: 30px">
		<col style="width: 90px">
		<col style="width: 200px">
		<col style="width: 200px">
		<col style="width: 600px">
		<col style="width: 300px">
		<col style="width: 500px">
		<thead class="thead">
			<tr>
				<th>
					#
				</th>
				<th>
					姓名
				</th>
				<th>
					年龄
				</th>
				<th>
					职业
				</th>
				<th>
					住址
				</th>
				<th>
					兴趣爱好
				</th>
				<th>
					其他
				</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
	</table>
</div>

[akaxiaok339]

看规范咯 https://drafts.csswg.org/css2/#propdef-table-layout

[Alander]

@akaxiaok339 感谢感谢