【问题标题】：Add border color to range knob ionic-range为范围旋钮 ionic-range 添加边框颜色
【发布时间】：2019-10-31 09:36:31
【问题描述】：
我正在使用 ion-range 添加范围滑块，并希望为范围旋钮添加边框。由于它的 ionic4 和 range-knob 是 shadow dom 的一部分，因此我无法使用 range 旋钮的 border 属性直接更改边框。我附上了我想要实现的图像。范围旋钮周围有一个白色边框。现有属性只有一个接近我要求的盒子阴影属性，但仍然不能给出与图像完全相同的结果。如何为旋钮添加边框？
【问题讨论】：
标签：
css
ionic-framework
ionic4
【解决方案1】：
试试这个：
page.scss
ion-range{
--knob-background: #02a7de;
--bar-background-active: #02a7de;
--bar-background: #02a7de;
--bar-height: 6px;
--knob-size: 18px;
--knob-border-radius: 50%;
--bar-border-radius: 20px;
--knob-box-shadow: 0px 0px 0px 3px #fff;
}