自定义滑动条input[type="range"]样式

有时候我们需要修改浏览器的原始滑动条样式，并针对不同浏览器兼容，首先来看一下不同的浏览器的原始滑动条：

chrome：    

firefox：    

IE：              

 

下面是我们要达到的效果：

chrome、firefox：                              IE：    

直接上代码：