最近不太忙，多写几篇文章。很多时候我们用js来实现视觉效果，其实不用那么麻烦，掌握一些常用的css知识能让你事半功倍，这篇文章讲的是使用纯css来实现一个列表项的选中效果，希望对你有所帮助 先上链接，点击预览https://codepen.io/Ritr/pen/Bgqemr 实现这个效果只需要简单三步走： 0：写一个简单的列表，并且初始化css html代码 你喜欢哪种水果 香

最近切一个页面的时候涉及到了一个tab切换的部分，因为不想用js想着能不能用纯CSS的选择器来实现切换效果。搜了一下大致有下面三种写法。 1、利用 :hover 选择器 缺点：只有鼠标在元素上面的时候才有效果，无法实现选中和默认显示某一个的效果 2、利用 a标签的锚点 + :target选择器 缺点：因为锚点会将选中的元素滚动到页面最上面，每次切换位置都要移动，体验极差。 3、利用 label和radio 的绑定关系和 radio选中时的:checked 来实现效果 缺点：HTML结构元素更复杂