解决实现伪元素的 hover 效果的问题：
Posted 张子溪
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了解决实现伪元素的 hover 效果的问题：相关的知识，希望对你有一定的参考价值。
例如，当有一个元素上面有一个伪元素时，像给这个伪元素设置一个 hover 效果，当该伪元素 hover 时，才显示该伪元素。
元素：
li {
background: red;
}
li:after {
border: 1px solid blue;
}
这个时候，先在该伪元素所在的元素上加上 hover，然后在 hover 后面加上 :after 即可。
例如，接着上面例子中的代码，继续写如下代码：
li:hover:after {
border: 1px solid blue;
}
加上上面代码后，即可实现只有当 hover 时，显示该伪元素。注意顺序，hover 在前面，after 在后面。
参考：
[https://stackoverflow.com/questions/13233991/combine-after-with-hover](https://stackoverflow.com/questions/13233991/combine-after-with-hover)
以上是关于解决实现伪元素的 hover 效果的问题：的主要内容，如果未能解决你的问题，请参考以下文章