CSS3. Селектор :not.


Век живи — век учись. Хоть я и не верстальщик, но правки в верстку вношу часто. При этом наличие CSS-селектора :not всегда скрывалось от моего внимания.

На самом же деле в CSS3 подобный сплектор есть и позволяет решить множество проблемных вопросов. Например, на данном сайте я добавлял правило для подсветки строк в таблице в контентной области.

Но, со временем, я увидел, что данное правило перебивает таблицу, которую создает crayon. Таким образом, мне надо было сделать так, чтобы селектор подсвечивал ВСЕ таблицы, кроме тех, у которых есть класс crayon-table.

5 минут в гугле и вуаля. Решение задачи ниже:

.post table:not(.crayon-table) tr:nth-child(2n) td{ background: #f5d19b; }
.post table:not(.crayon-table) tr:nth-child(2n+1) td{ background: #fcf2e2; }

Вот и все — удачной верстки!

,

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *