Чи є перемикач SASS / CSS для елементів БЕЗ того чи іншого сусіднього брата? - css, css3, sass, css-селектори, брати і сестри

Я хочу поставити верхню межу на все <li> елементи з класом "foo", які НЕ суміжними братами а <li> елемент із класом "bar".

Чи є "селектор SASS / CSS без сусідніх братів [x]"? Або це єдиний спосіб виконати це за допомогою двох правил, один для того, щоб додати верхню межу для всіх <li class="foo">і ще, щоб відняти його від <li> поруч з <li class="bar">?

Відповіді:

Коли я піддаюсь крихті, ви хочете мати таке:

http://jsfiddle.net/gECc9/

HTML

<ul>
<li class="bar">Bar</li>
<li class="foo">foo</li>
<li class="foo">foo</li>
<li class="foo">foo</li>
<li class="foo">foo</li>
<li class="bar">Bar</li>
<li class="foo">foo</li>
<li class="foo">foo</li>
<li class="foo">foo</li>
<li class="foo">foo</li>
</ul>

CSS:

li:not(.bar)+li.foo
{
border-top: 1px solid blue;
}

Селектор, який вибирає кожен <li class="foo"> це не сусіднє братство <li class="bar">

Цей селектор має лише слабкість, яка потребує одного провідника <li>. Якщо перший елемент не є а <li class="bar"> товар буде виключений. Це можна вирішити, як це бачимо тут:

http://jsfiddle.net/gECc9/1/

li:not(.bar)+li.foo,
li.foo:first-child
{
border-top: 1px solid blue;
}

П.С. коли ви хочете об'єднати об'єкти всередині списку, ви також можете використовувати списки визначення <dl> або вкладені списки. Це може запобігти таким проблемам.