只有一个孩子的最后一个元素的选择器

时间:2019-10-29 22:53:07

标签: css

我有一个特定的布局

div {border: 1px solid #555; margin: 10px 0;}
p {border: 1px solid #c00; margin: 3px;}
<div><p>bar</p><p>baz</p></div>
... from one to ten elements like above
<div><p>bar</p><p>baz</p></div>

<div><p>not me</p></div>

<div><p>bar</p><p>baz</p></div>
... again from one to ten elements like above
<div><p>bar</p><p>baz</p></div>

<div><p>find me</p></div>

<div><p>bar</p><p>baz</p></div>
... and again from one to ten elements like above
<div><p>bar</p><p>baz</p></div>

我不能使用任何类或ID。我不能使用Javascript。 'bar-baz'div's的数量未知。

我必须找到只有一个div(带有'find me'文本)的最后一个p

我尝试使用div p:only-child,但它也找到了第一个带有'not me'文字的元素。

div {border: 1px solid #555; margin: 10px 0;}
p {border: 1px solid #c00; margin: 3px;}
div p:only-child {border-width: 3px;}
<div><p>bar</p><p>baz</p></div>
... from one to ten elements like above
<div><p>bar</p><p>baz</p></div>

<div><p>not me</p></div>

<div><p>bar</p><p>baz</p></div>
... again from one to ten elements like above
<div><p>bar</p><p>baz</p></div>

<div><p>find me</p></div>

<div><p>bar</p><p>baz</p></div>
... and again from one to ten elements like above
<div><p>bar</p><p>baz</p></div>

是否可以编写正确的选择器?

0 个答案:

没有答案