写在前面：
之前踩坑css的时候，遇到滑轮，按钮，选择框这类型的东西，为了页面效果，总是需要自定义他们的样式，而不使用他们的默认样式。当时写的时候，我也是蛮头疼的，弄了个demo，链接在下面。对此做个总结。本文是面向前端小白的，大手子可以跳过，写的不好之处多多见谅。
额，今天就先大概的将代码贴上来，考虑到篇幅的问题，就先写一下三个的实现方式，一般也都看得懂，代码注释的非常详细。因为细分下来内容也很多，准备之后再将如何实现的方式，属性，优化以及如何兼容各个浏览器的方式一步步的写出来。
最终效果：
如何使用这些属性？
用法很简单，如下所示：
//滑动条
//按钮
//选择框
input type="range"样式修改：
html content
csscontent
.slider-block{
outline: none; /*去掉点击时出现的外边框*/
-webkit-appearance: none;
-moz-appearance: none;
appearance: none; /*这三个是去掉那条线原有的默认样式，划重点！！*/
width: 30%;
height: 0.3rem;
background: orange; /*这三个是设置滑块下面那条线的样式*/
}
input[type&#
