input[type="range"]是html5中的input标签新属性,样子如下:
<inputtype="range"value="40"/>如果想让此滑块效果如下图所示,怎么做呢?
以下是样式部分:
<styletype="text/css">input[type="range"]{-webkit-box-shadow:01px00px#424242,01px0#060607inset,0px2px10px0pxblackinset,1px0px2pxrgba(0,0,0,0.4)inset,00px1pxrgba(0,0,0,0.6)inset;margin-top:2px;background-color:#272728;border-radius:15px;width:400px;-webkit-appearance:none;height:10px;}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;cursor:default;top:-5px;height:30px;width:20px;transform:translateY(-4px);background:nonerepeatscroll00#777;border-radius:15px;-webkit-box-shadow:0-1px1pxblackinset;}</style>新闻热点
疑难解答