所谓“火柴棒”，不是真的指现实中的火柴棒，而是因为HTML的form控件中，input type="range" 的样式很像个火柴棒。试看：

range 在不同内核的浏览器环境下，样式会有所不同，但是颜色肯定都不好看。正如之前我们曾经介绍过的给其它HTML控件做化妆一样，我们可以通过手术让它脱胎换骨，可是手术费实在不低。其实呢，css3有一个属性，accent-color，允许用来设置少量HTML元素的强调颜色。accent 这个单词有“口音”、“重音”、“强调”等意思，css3里的 accent 取“强调”之意，accent-color 指的就是强调颜色。看代码：

1. .mama input[type="range"] {
2.     accent-color: green;
3. }

这将使得 class="mama" 的元素里的所有 range 滑杆呈现出绿色。

除了 range，input 中的 radio（单选按钮）、checkBox（复选按钮）等也支持 accent-color 属性。下面就是它们哥仨设置强调颜色为绿色的样纸：

前一篇: JS：进制及十进制与其它进制间的互转
下一篇: 保姆级range进度条音频播放器开发教程（一）