CSS3自定义滚动条样式的示例代码
滚动条是一个常见的东西，但有些浏览器自己的滚动条不是很好。现在我们可以学习为例探讨自定义滚动条的实现，这样你的滚动条可以是美丽的。但是，只有玩，因为只有浏览器的WebKit内核啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊！溢出的介绍
定义：溢出属性指定是否编辑内容、呈现滚动条，或在溢出其块级容器时显示内容。
属性值
溢出：可见的/默认值。内容不会被删除，内容将显示在元素框架之外。
溢出：隐藏的内容将被删除。
溢出：滚动的内容将被修整，浏览器将显示滚动条来查看剩余的内容。
溢出：如果内容被裁剪，浏览器将显示一个滚动条来查看其他内容。
溢出：从父元素的继承继承/继承/继承条款继承溢出属性的值。
注意：任何版本的Internet Explorer（包括IE8）不支持的属性值inherit 。
当溢出设置为非默认值（可见的），它会创建一个方法来阻止课堂语境（一种清除浮动），和更了解BFC和边缘塌陷。
小提示
对于该行的文本超出属性可以使用。（同时，你需要设置宽度值的元素，以及溢出：隐藏；白色空间：nowrap；）
文本溢出：剪贴正文。
文本溢出：省略号显示省略号文本。
文本溢出：使用给定文本来表示修剪的字符串。
对于多行文本，我们需要使用非标准属性的WebKit的线夹，这是无法描述的在这里。
水平和垂直轧制带
overflow-x和overflow-y可以用来设置水平和垂直滚动条，分别。
自定义滚动条的实现
这部分的Webkit内核的浏览器，使用伪类改变滚动条的默认样式，具体如下：
滚动条组件
1。：：的WebKit的滚动条滚动条的整体的一部分
2。：- WebKit的滚动条拇指滚动条内框，向下移动（或左右移动）
3：对WebKit的滚动条轨道滚动条轨道（用拇指在）
4。：- WebKit的滚动按钮：滚动条的轨道两端，通过微调位置点击箱子。
5。：- WebKit的滚动条轨道内的轨道，滚动条的中间部分
6：滚动条的WebKit的拐角处，在垂直滚动条和水平滚动条相交
7。：：拖动元素的大小对WebKit的缩放两滚动条相交的小控制
滚动条的结构图如下所示：
下面的一组简单的自定义滚动条的实现：
这个属性定义了溢出的元素内容区的内容会处理。如果值为滚动，用户代理提供了一种滚动机制，无论是否还需要。因此，它是可能的即使所有的内容都可以放下在元件盒有一个滚动条。此属性如何定义的溢出元素内容区域的内容将被处理。如果该值
滚动，不管是否需要，用户代理提供一个滚动机制。因此，即使所有内容都可以放在元素框中，也可以有滚动条。
。box8：：{ WebKit的滚动条
宽度：12px；
背景颜色：# Eee；
}
：：。box8 WebKit的滚动条轨道{
背景颜色：# Eee；
}
：：。box8 WebKit的滚动条拇指{
背景：# 3db6a4；
}
：：。box8 WebKit的滚动按钮：开始{
背景：URL（。 / / IMGS，PNG）不重复；
背景尺寸：12px 12px；
}
：：。box8 WebKit的滚动条按钮：结束{
背景：URL（。 / /下影天。PNG）不重复；
背景尺寸：12px 12px；
}
更多的效果如下：
只注意镀铬！！！！！！！
源地址下载
以上是本文的全部内容，希望能对您有所帮助，希望大家多多支持。