我见过一些类似的问题，但它们与我所追求的不符。我遇到的情况是一个表可以有内表。但是，我喜欢内表忽略“myTable”定义的样式。我怎样才能做到这一点？
最好不要为内表添加 CSS。或者至少无需添加新类或对内表 ID 的引用。感谢您的帮助。
#myTable td, #myTable th {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
word-wrap: break-word;
}
#myTable th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #00bf11;
color: white;
}
#myTable {
border-collapse: collapse;
width: 100%;
border: 1px solid #ddd;
font-size: 12px;
font-family: Verdana, sans-serif;
table-layout: fixed;
}<html>
<body>
<table id="myTable">
<tr class="header">
<th onclick="sortTable(0)" style="width:6%;">Col1</th>
<th onclick="sortTable(1)" style="width:9%;">Col2</th>
<th onclick="sortTable(2)" style="width:85%;">Col3</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>
<table class="table table-bordered">
<tbody>
<tr>
<th>Col One</th>
<th>Col Two</th>
<th>Col Three</th>
</tr>
<tr>
<td>One</td>
<td>Two</td>
<td>Three</td>
</tr>
</tbody>
</table>
</td>
</table>
</body>
</html>最佳答案
Deryck 给出了正确的答案，尽管由于浏览器实现和缺少 tr 的原因，它并不完整
#myTable > tbody > tr > td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
word-wrap: break-word;
}
#myTable > tbody > tr > th {
border: 1px solid #ddd;
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #00bf11;
color: white;
}
#myTable {
border-collapse: collapse;
width: 100%;
border: 1px solid #ddd;
font-size: 12px;
font-family: Verdana, sans-serif;
table-layout: fixed;
}<html>
<body>
<table id="myTable">
<tr class="header">
<th onclick="sortTable(0)" style="width:6%;">Col1</th>
<th onclick="sortTable(1)" style="width:9%;">Col2</th>
<th onclick="sortTable(2)" style="width:85%;">Col3</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>
<table class="table table-bordered">
<tbody>
<tr>
<th>Col One</th>
<th>Col Two</th>
<th>Col Three</th>
</tr>
<tr>
<td>One</td>
<td>Two</td>
<td>Three</td>
</tr>
</tbody>
</table>
</td>
</table>
</body>
</html>关于css - 如何让内表忽略继承的样式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57838615/