Есть например примитивное меню в котором есть разделители в виде вертикальных полос. Я делаю это с помощью бордера вот так
.navbar
max-width: 725px
float: left
background: transparent
border: none
&__li:not(:last-child)
border-right: 1px solid white
А вот код меню
<ul class="nav navbar-nav">
<li class="navbar__li active"><a class="navbar__link" href="#">О нас</a></li>
<li class="navbar__li"><a class="navbar__link" href="#">Наши услуги</a></li>
<li class="navbar__li"><a class="navbar__link" href="#">Отзывы</a></li>
<li class="navbar__li"><a class="navbar__link" href="#">Акция</a></li>
<li class="navbar__li"><a class="navbar__link" href="#">Контакты</a></li>
</ul>
А если я захочу подействовать на допустим на ссылку в последнем элементе li как мне поступить? Это может понадобиться если я этот разделитель буду задавать не в li, а в самой ссылке a. Ну или я например буду писать стиль чего либо.
На пример модального окна
.modal-green
&__button
background: green
&__link
color: green
Если с бэм, то можно так:
<ul class="nav navbar-nav">
<li class="navbar__li active"><a class="navbar__link" href="#">О нас</a></li>
<li class="navbar__li"><a class="navbar__link" href="#">Наши услуги</a></li>
<li class="navbar__li"><a class="navbar__link" href="#">Отзывы</a></li>
<li class="navbar__li"><a class="navbar__link" href="#">Акция</a></li>
<li class="navbar__li navbar__li_last"><a class="navbar__link" href="#">Контакты</a></li>
</ul>
Т.е. добавить последнему элементу модификатор navbar__li_last и его стилизовать.
Либо использовать &__li:last-child:
.navbar
...
&__li
border-right: 1px solid white
&__li:last-child
border-right: none
При этом всем лишкам Вы задаете необходимые стили, а последнему элементу уже или отменяете или задаете свои стили, соответственно и для ссылки внутри лишки.
Пример для ссылки:
&__li:last-child
a
border: none
или
<li class="navbar__li"><a class="navbar__link navbar__link_last" href="#">Контакты</a></li>
navbar__link_last
border: none
+ поддержка Вашего :not(), может быть это плохая идея использовать его!
Сборка персонального компьютера от Artline: умный выбор для современных пользователей