我并排放置了25％宽的物品。我正在添加一个 clear:both 在每四个元素之后。但是我需要在元素之间插入一个图形分节符。它必须在里面 <ul>。为了有效，我把“section-break”（下面样本中的第一个li项）包装成了一个 <li> 同样。
<ul>
<li class="year"><h1>THIS IS A SECTION Break and 100% wide</h1></li>
<li>This is a article and only 25% wide</li>
<li>This is a article and only 25% wide</li>
<li>This is a article and only 25% wide</li>
<li>This is a article and only 25% wide</li>
</ul>
我希望每个第四个元素都是换行符，所以我用...
ul li:nth-of-type(4n+1) { clear: both; }
不过我想要的 li.year 不要受这种行为的影响，所以我尝试了这个
ul li:not(.year):nth-of-type(4n+1) { clear: both; }
现在是最后一个 <li> 在上面的示例代码中，浮动到下一行，但从第一行开始不应该发生 <li> 不是浮动文章之一，但包含标题。
有可能堆叠 :not 和 nth-of-type() 选择器彼此？
你有的选择器 -
ul li:not(.year):nth-of-type(4n+1) { background: yellow; }
- 完全正确（如突出显示选择器所示）。
问题在于你如何使用 clear。它可以使用 clear:right， 接着 clear:left 在以下元素上：
ul li:not(.year):nth-of-type(4n+1) { clear: right; }
ul li:not(.year):nth-of-type(4n+2) { clear: left; }
你有的选择器 -
ul li:not(.year):nth-of-type(4n+1) { background: yellow; }
- 完全正确（如突出显示选择器所示）。
问题在于你如何使用 clear。它可以使用 clear:right， 接着 clear:left 在以下元素上：
ul li:not(.year):nth-of-type(4n+1) { clear: right; }
ul li:not(.year):nth-of-type(4n+2) { clear: left; }
你原因 :not() 似乎不起作用是因为 li.year 与您的其他元素具有相同的元素类型 li 元素（自然地），所以 :nth-of-type(4n+1) 无论如何匹配相同的元素 .year 类。
也不可能顺序堆叠选择器。这不是他们的工作方式。
既然你无法改变你的 li 由于HTML标记规则，元素到其他东西，和 :nth-match() 是在一个 未来的规格 并且尚未实施，你必须改变你的 :nth-of-type() 改为适应结构的公式：
ul li:not(.year):nth-of-type(4n+2) { clear: both; }