HTML:
<div> <ul> <li id='li1'>1</li> <li id='li2'>2</li> <li id='li3'>3</li> </ul> <a href='#li1'>a</a> <a href='#li2'>b</a> <a href='#li3'>c</a></div>
CSS:
@keyframes act{ 0%{background:red}; 100%{background:white};}li:not(:target){ animation:act 1s ease-in;}进入页面的时候，就会执行li:not(:target)，效果在三个li都可用
一旦点击激活target，li:not(:target)就意味着上一个激活的target：
首先点击a，激活target，li:not(:target)无效果
再点b，在第一个li处出现效果
是不是有点坑，呵呵哒。
他的用处就是在手动图片轮播的时候改变z-index的最佳利器！
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
