我的表没有从外部css继承其样式

Question

我的index.html文件如下所示。。

<table class="tablecontainer">
<table id="table1"></table>
</table>

我的styles.css文件如下。。。

.tablecontainer #table1 th, td {
border: 1px solid #ddd;
border-collapse:collapse;
font-family:"Open Sans";
font-size: 30px;
}
.tablecontainer #table1 tr:nth-child(even) {
background-color: #fff;
font-family:"Open Sans";
font-size: 12px;
}
.tablecontainer #table1 tr:nth-child(odd) {
background-color: #eee;
font-family:"Open Sans";
font-size: 12px;
}
.tablecontainer #table1 th {
background-color: grey;
color: white;
text-align: left;
font-family:"Open Sans";
font-size: 16px;
}
.tablecontainer #table1 tr:hover {
background-color: #cce6ff;
}

我可以确认，按钮、标题等其他东西的样式是从我的styles.css文件中正确提取的。

然而，我的表的样式没有被提取(我在styles.css中编写的样式都没有被继承给表。

一般来说，我是html/css的新手。

编辑(原问题(：

<div class="tablecontainer">
<table id="table1"></table>
</div>
<script>
...
var trHTML = '';
trHTML += '<tr><th>...</tr><th>';
...
$('#table1').append(trHTML);
</script>

Answer 1

不能将一个表直接插入另一个标记<table>：<tr>和<td>标签是必需的。

<table class="tablecontainer">
<tr><td>
<table id="table1"></table>
</td></tr>
</table>