Блог

Главная - Вопросы по программированию - Таргетинг на последнее поле формы в форме, а затем на некоторые

Таргетинг на последнее поле формы в форме, а затем на некоторые

#html #css #css-selectors

#HTML #css #css-селекторы

Вопрос:

У меня есть эта форма, в которой я пытаюсь настроить таргетинг на определенный элемент, у которого нет собственного класса. К сожалению, я не могу изменить 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>

Ответ №1:

Вы не можете настроить таргетинг на последний класс. Вы могли бы использовать что-то, основанное на порядке элементов HTML, например:

 .formfield   p   p { }

Или это:

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

Ответ №2:

Просто используйте 

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

https://jsfiddle.net/jqnx9fh6/

Ответ №3:

Попробуйте использовать специфику CSS:

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