Комбинирование: Последний ребенок с: NOT (.CLASS) SELECTER в CSS

В CSS часто необходимо выбрать конкретные элементы, основанные на нескольких критериях. Одним из таких случаев является выбор последнего ребенка, у которого нет определенного класса. Хотя это может показаться простым, используя только: «Последний ребенок» и: НЕ (.class) Селекторы не дают желаемого результата.

Использование: Последний ребенок и: не (.class)

The: Селектор последнего ребенка нацелен на последнего ребенка элемента, а: не (.class) выбирает элементы, которые не имеют указанного класса. Однако эти селекторы не могут быть непосредственно объединены для достижения желаемого эффекта.

рассмотрим следующий пример:

 
 цель - выбрать третью строку, которая, которая будет нет класса "table_vert_controls". Следующее правило CSS не будет работать: 
 
tr:not(.table_vert_controls):last-child
 
] Это правило выберет последнюю строку, независимо от того, есть ли у него класс "table_vert_controls" not. 
 
 alternative Solutions 
 
 Поскольку селекторы CSS только не могут обрабатывать эту конкретную комбинацию, альтернатива Требуются решения: 
 
 
  использование дополнительного класса : добавить дополнительный класс в элемент перед желаемом классом, например, «Последний ребенок-но-класс». Затем используйте следующее правило: 
] 
 
.last-child-no-class:not(.table_vert_controls)
 
 
 $ ('tr: not (.table_vert_controls): last') ]