CSS ::file-selector-button 仮要素

定義と用法

CSS ::file-selector-button 仮要素は<input type="file">タイプのボタンを選択するために使用されます。

例1

<input type="file"> ボタンのスタイルを設定します:

::file-selector-button {
  border: 2px solid black;
  padding: 5px 10px;
  border-radius: 5px;
  background-color: lightgreen;
}

自分で試してみる

例2

<input type="file"> ボタンのスタイルを設定し、ホバーエフェクトを追加します:

::file-selector-button {
  border: 2px solid black;
  padding: 5px 10px;
  border-radius: 5px;
  background-color: lightgreen;
}
::file-selector-button:hover {
  background-color: salmon;
  cursor: pointer;
}

自分で試してみる

CSS文法

::file-selector-button {
  css宣言;
}

技術的な詳細

バージョン: CSS Pseudo-elements Module Level 4

ブラウザのサポート

テーブルの数字は、その仮要素を完全にサポートする最初のブラウザのバージョンを指定しています。

Chrome Edge Firefox Safari Opera
89 89 82 14.1 75

関連ページ

チュートリアル:CSS 仮要素