<分区>
<分区>
我希望我的输入类型的左侧部分:范围为#555555 并超过右侧的 slider 为#FFFFFF。
#seekslider {
position: fixed;
bottom: 30px;
left: 0px;
right: 0px;
height: 5px;
-webkit-appearance: none !important;
background-color: #FFFFFF;
}
#seekslider::-webkit-slider-thumb {
-webkit-appearance: none !important;
background-color: #006CD0;
height: 13px;
width: 13px;
border-radius: 100%;
cursor: pointer;
}
<input id="seekslider" type="range" min="0.0" max="100.0" value="0" step="0.1">
最佳答案
#seekslider {
position: fixed;
bottom: 30px;
left: 0px;
right: 0px;
height: 5px;
-webkit-appearance: none !important;
background-color: #FFFFFF;
}
#seekslider::-webkit-slider-thumb {
-webkit-appearance: none !important;
background-color: #006CD0;
height: 13px;
width: 13px;
border-radius: 100%;
cursor: pointer;
}
<input id="seekslider" type="range" min="0.0" max="100.0" value="0" step="0.1">
#seekslider {
position: fixed;
bottom: 30px;
left: 0px;
right: 0px;
height: 5px;
-webkit-appearance: none !important;
background-color: #FFFFFF;
}
#seekslider::-webkit-slider-thumb {
-webkit-appearance: none !important;
background-color: #006CD0;
height: 13px;
width: 13px;
cursor: pointer;
position:relative;
box-shadow: 0 0 0 red,
-13px 0 0 red,
-26px 0 0 red,
-39px 0 0 red,
-52px 0 0 red,
-65px 0 0 red,
-78px 0 0 red,
-91px 0 0 red,
-104px 0 0 red,
-117px 0 0 red;
z-index:2;
}
<input id="seekslider" type="range" min="0.0" max="100.0" value="0" step="0.1">
关于css - 输入范围有两种不同的背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30039349/