CSS选择器-常用的特殊的

1、:not()选择器为最后一个元素去除边框

一般写法

/* 添加边框 */
.nav li {
  border-right: 1px solid #666;
}

/* 去掉边框 */
.nav li:last-child {
  border-right: none;
}

高级写法

.nav li:not(:last-child) {
  border-right: 1px solid #666;
}

2、:not()选择器使列表的每项都由逗号分隔

ul > li:not(:last-child)::after {
  content: ",";
}

3、:not()选择器结合nth-child可以选择1至n个元素

/* 选择除前3个之外的所有项目，并显示它们 */
li:not(:nth-child(-n+3)) {
  display: none;
}

4、:not()选择器隐藏没有静音、自动播放的影片

这是一个自定义用户样式表的不错的技巧。避免在加载页面时自动播放。如果没有静音，则不显示视频：

video[autoplay]:not([muted]) {
  display: none;
}