在表单中定位最后一个表单字段，然后再定位一些

Question

我有这种形式，我试图定位没有自己类的某个元素。不幸的是，我无法更改html。

我正在尝试定位最后一个.formfield元素，然后定位之后的第二个p标签。

我尝试使用:last-child，:last-of-type和：nth-last-child()，但我似乎找不到最后一个。

使用下面的html，如何定位<p>Target me</p>？

.form form[name="pageform"] .formfield:last-child+p+p {
  color: red;
}

<div class="form">
  <form enctype="" name="pageform" onsubmit="formhandler(); return true;" action="#" method="post">
    <input type="hidden" name="form_submitted" value="1">
    <div class="formfield">...
    </div>
    <div class="formfield">...
    </div>
    <div class="formfield">...
    </div>
    <p><input type="checkbox" name="gdpr-accept"></p>
    <p>Target me</p>
    <div id="submit_div">
      <input type="submit" id="submit_button" value="Send">
    </div>
  </form>
</div>

Answer 1

您不能定位最后一堂课。您可以根据HTML元素的顺序使用某些内容，例如：

.formfield + p + p { }

或者这个：

div:nth-last-of-type(2) + p + p { }

Answer 2

只需使用

form[name="pageform"] p:last-of-type {
  background: red;
}

https://jsfiddle.net/jqnx9fh6/

Answer 3

尝试使用CSS特异性：

div.form form p:last-of-type {
    background: red;
}