0

ページに があり、css でスタイルを設定しました。

input[type=range] {
  -webkit-appearance: none;
  background-color: #1b2b66;
  width: 300px;
  height: 3px;
  position: relative;
  top: -9px;
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  background-image: url("../images/slider.png");
  background-size: 100% auto;
  border: 0px;
  width: 35px;
  height: 35px;
}

問題は次のとおりです。ユーザーがスライダーのつまみをクリックすると、iPad で黒い境界線が画像を囲みます。これを隠すにはどうすればよいですか？

4

2 に答える 2

0

私は自分の問題を理解しました。まず、助けてくれたみんなに感謝します。

background-color:プロパティの設定を忘れていました。に設定する#FFFと、目的の効果が得られます。

于 2013-09-30T21:34:52.903 に答える
0

modernizr機能検出を実行するには、を使用する必要があります。

<script src="modernizr.js"></script>
<script>Modernizr.load({
  test: Modernizr.inputtypes.range,
  nope: ['use your css to define the range input format']
});
</script>

このテストはサポートを探します。失敗すると、css をロードしてその入力をフォーマットします。ブラウザーがこのタグをサポートしている場合、つまり、そのコントロールをレンダリングする標準的な方法があり、CSS が冗長になります。この場合、通常はブラウザが CSS 設定を無視するようにします。

デフォルトのCSS設定を本当に上書きしたい場合。を使ってみてください!important。

border: 0 !important;
于 2013-09-30T21:12:27.133 に答える