css3鼠标悬停选中li

CSS3 鼠标悬停选中 li 元素是我们经常用到的一个小特效。在 CSS3 中，我们可以使用 :hover 伪类实现 li 元素的鼠标悬停选中效果，并且可以通过一些属性来定制选中效果。

li:hover {
    background-color: #f1f1f1;
    color: #000;
} 

上面的代码表示在鼠标悬停在 li 元素上时，背景颜色会变成 #f1f1f1，字体颜色变成 #000。

除了修改背景颜色和字体颜色，我们也可以设置元素边框颜色和大小：

li:hover {
    border: 1px solid #333;
} 

上面的代码表示在鼠标悬停在 li 元素上时，会出现 1px 粗细、#333 颜色的边框。

可以通过修改不同的 CSS 属性，来实现不同样式的鼠标悬停选中效果。值得注意的是，这个效果只有在鼠标悬停时才会出现，如果想要永久修改 li 元素的样式，可以使用 nth-child 伪类或添加类名实现。