“完全包裹”的独子选择器

Question

我想只在第一个表中选择<em>元素，而不是第二个。是否有任何CSS选择器可以这样做？

要澄清：我只想在表格后面<em>内选择<p>，只要em完全包含在p中。即：<p>只包含<em>。

顺便说一句，我不确定在最后一个What do you think about元素中调用thing?和<p>部分的内容。从技术上讲，它们不是兄弟元素，因为它们不是元素。

我想单独使用CSS。

<table>
<td>blah</td>
</table>
<p><em>My name is legend</em></p>


<table>
<td>blah</td>
</table>
<p>What do you think about <em>this</em> thing?</p>

这是我到目前为止所做的，但这太宽泛了并选择了两者：

table + p > em:only-child {
    color: red;
}

Demo here on JSFiddle

Answer 1

尝试

table:first-of-type + p > em:only-child {
    color: red;
}