Недавно увидел твит Матта Гриффана, который гласит:
Наконец-то сделал свою жизнь проще, используя :not(:last-of-type), вместо того, чтобы переопределять свойства отдельным правилом :last-of-type. О да!
Взрыв. Разума.
Почему я не знал это раньше? Эта мелочь позволяет сэкономить так много времени и строк кода. Давайте объясню. Допустим, вы задаете стили для списка статей.
Вот как глупо я стилизовал это. Говорю же: глупо!
.post {
border-bottom: 1px solid #eee;
margin-bottom: .5rem;
padding-bottom: .5rem;
&:last-child {
border-bottom: 0;
margin-bottom: 0;
padding-bottom: 0;
}
}
Куча кода только для того, чтобы добавить пространства после каждой статьи, кроме последней. Вот для чего был создал :not
!
.post:not(:last-of-type) {
border-bottom: 1px solid #eee;
margin-bottom: .5rem;
padding-bottom: .5rem;
}
Мы избавились от 5 строк кода. Просто представьте, сколько вы сможете сэкономить, используя это в коде реального проекта. Я создал Codepen, чтобы вы смогли увидеть это в действии.
Надеюсь этот совет будет для вас полезным.
Статью перевел aziev. Оригинал на Theboldreport.net доступен по ссылке.