输入类型范围样式

Question

我创建了一个带有两个处理程序的滑块，为了达到这个目的，我将一个输入类型范围放在另一个上，滑块工作正常，但是它上面有一条奇怪的线条，我无法确定它是什么：

HTML：

<section  data-range-slider 
          class="range-slider" 
          ng-model="range" 
          min="0" 
          max="max">
<input list="numbers" type="range" ng-change="_which = 0" ng-model="_model[0]" min="0" max="1800" step="1" >
<input type="range" ng-change="_which = 1" ng-model="_model[1]" min="0" max="1800" step="1">
</section>

SASS：

  section.range-slider
    overflow: hidden
    position: relative
    width: 200px
    height: 35px
    input
      pointer-events: none
      position: absolute
      overflow: hidden
      left: 0
      top: 0
      width: 200px
      outline: none
      height: 18px
      &::-webkit-slider-thumb
        pointer-events: all
        position: relative
        z-index: 1
        outline: 0
      &::-moz-range-thumb
        pointer-events: all
        position: relative
        z-index: 10
        -moz-appearance: none
        background: linear-gradient(to bottom, #ededed 0%, #dedede 100%)
        width: 11px
      &::-moz-range-track
        position: relative
        z-index: -1
        background-color: rgba(0, 0, 0, 0.15)
        border: 0
      &:last-of-type::-moz-range-track
        -moz-appearance: none
        background: none transparent
        border: 0

  ul.from-to
    display: block
    list-style-type: none
    margin-top: 10px
    font-family: Arial, Tahoma, Verdana, Arial, Helvetica, sans-serif
    font-size: 11px
    li
      margin-bottom: 1px
      label
        background-color: rgba(0, 0, 0, 0)
        height: 24px
        line-height: 24px
        display: inline-block
        width: 60px
        padding: 0 10px
        float: left
        font-size: 9px
        color: rgba(0, 0, 0, 0)
        text-transform: uppercase
      input
        border: 1px solid rgba(0, 0, 0, 0.1)
        padding: 0 8px
        height: 24px
        line-height: 24px
        outline: none

此行是伪元素还是输入类型=＆＃34;范围＆＃34;元件？我该如何删除它？

Answer 1

将其添加到输入以覆盖默认浏览器样式：

&::focus
    outline: none
    -moz-box-shadow: none
    -webkit-box-shadow: none
    box-shadow: none