伪类

某厂面试归来，发现自己落伍了！>>> 前段时间，到网上找素材时，看到了一个很个性的滚动条式，打开Chrome的调试工具看了一下，发现不是用JavaScript来模拟实现的，觉得有必要折腾一下。于是在各大浏览器中对比了一下，发现只用Chrome适用，也就是说这个用的是Chrome的私有CSS属性。便百之谷之后，发现原来不仅仅只用Chrome，其它的浏览器在不同程度上支持自定义滚动条样式的。下面是我不断测试的结果，若有错误或不全，请在评论里面给出，我会立马更正；若有更好的方案，你可以留言，让大家都开开眼界。。。。。。 自定义IE浏览器滚动条样式 追溯浏览器对滚动条的自定义，恐怕最早的就是IE浏览器了（好像最开始支持的版本是IE5.5）。下面列出了多个版本的支持性况： 滚动条样式 支持情况 支持浏览器版本 可否继承 描述 scrollbar-3dlight-color IE特有属性 IE5.5+ y 设置滚动框的和滚动条箭头左上边缘的颜色 scrollbar-highlight-color IE特有属性 IE5.5+ y 设置滚动框的和滚动条箭头左上边缘的颜色 scrollbar-face-color IE特有属性 IE5.5+ y 设置滚动框和滚动条箭头的颜色 scrollbar-arrow-color IE特有属性 IE5.5+ y 设置滚动条箭头的颜色 scrollbar

前面花了两节内容分别在《 CSS3选择器——基本选择器 》和《 CSS3选择器——属性选择器 》介绍了 CSS3选择器 中的基本选择器和属性选择器使用方法，今天要和大家一起学习 CSS3选择器 中的第三部分，也是最后一部分——伪类选择器。伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了，因为这些在平时中是常用到的伪类选择器，那么先和大家一起简单总结一下CSS中常用的伪类选择器的使用方法，最后把重心放到CSS3新增加的":nth-child"选择器的使用方法。 和前面一样，在开始之前先创建一个Dom: < div class = "demo clearfix" > < ul class = "clearfix" > < li class = "first links odd" id = "first" > < a href = "" > 1 </ a > </ li > < li class = "links even" > < a href = "" > 2 </ a > </ li > < li class = "links odd" > < a href = "" > 3 </ a > </ li > < li class = "links even" > < a href = "" > 4 </ a > </ li > < li class