---
title: '::-webkit-slider-thumb'
slug: 'Web/CSS/::-webkit-slider-thumb'
tags:
  - CSS
  - NeedsBrowserCompatibility
  - NeedsCompatTable
  - NeedsExample
  - NeedsMobileBrowserCompatibility
  - Non-standard
  - Pseudo-element
  - Reference
  - 擬似要素
  - 標準外
translation_of: 'Web/CSS/::-webkit-slider-thumb'
---
<div>{{CSSRef}}{{Non-standard_header}}</div>

<p><strong><code>::-webkit-slider-thumb</code></strong> は CSS の<a href="/ja/docs/Web/CSS/Pseudo-elements">擬似要素</a>で、数値の値を変更する {{HTMLElement("input")}} の <code>type="range"</code> でユーザーが「溝」の中を動かすことができる「つまみ」を表します。</p>

<h2 id="Specifications" name="Specifications">仕様書</h2>

<p>どの仕様書でも定義されていません。これは WebKit/Blink に固有の私有擬似要素です。</p>

<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

<p>{{Compat("css.selectors.-webkit-slider-thumb")}}</p>

<h2 id="See_also" name="See_also">関連情報</h2>

<ul>
 <li>{{cssxref("::-webkit-slider-runnable-track")}}</li>
 <li>他のブラウザーで使われている類似の擬似要素:
  <ul>
   <li>{{cssxref("::-moz-range-thumb")}}</li>
   <li>{{cssxref("::-ms-thumb")}}</li>
  </ul>
 </li>
 <li><a href="https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/">CSS-Tricks: Styling Cross-Browser Compatible Range Inputs with CSS</a></li>
 <li><a href="http://www.quirksmode.org/blog/archives/2015/11/styling_and_scr.html">QuirksMode: Styling and scripting sliders</a></li>
 <li><a href="https://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html">Couple of Gotchas to Watch-out For</a></li>
</ul>