`::-moz-range-thumb` 擬似要素 (CSS)

非標準: この機能は標準化されていません。非標準の機能はブラウザーの対応が限られ、将来的に変更または削除される可能性があるため、本番環境での使用は推奨されません。ただし、標準の選択肢が存在しない特定のケースでは、有効な代替手段となる場合があります。

::-moz-range-thumb は CSS の擬似要素で、Mozilla 拡張であり、<input> の type="range" のつまみ（つまり、仮想ノブ）を表します。ユーザーは、入力フィールドのトラック上をつまみを移動させることで、その数値を変更することができます。

メモ: ::-moz-range-thumb を <input type="range"> 以外の要素で使用しても、一致する要素がなく、何の効果もありません。

構文

css

::-moz-range-thumb {
  /* ... */
}

html

<input type="range" min="0" max="100" step="5" value="50" />

css

input[type="range"]::-moz-range-thumb {
  background-color: green;
}

このページは MDN の貢献者によって 2026年9月22日に最終更新されました。