input要素
Webページでは、テキストを入力してサーバーに送信したりできます。
本ページでは、input要素について説明します。
input要素とは
input要素は、フォームコントロールの一種です。テキスト入力欄やボタンなどを表示して、form要素で指定したサーバーにデータを送信します。
inputの定義は、以下のとおりです。
コンテンツカテゴリ | フローコンテンツ、フレージングコンテンツ、リスト、サブミット、Autocapitalize属性を継承する、リセット可能、フォーム関連要素 type属性がhiddenでない場合:対話型コンテンツ、認知可能コンテンツ、ラベル付け可能 |
---|---|
可能な親要素 | フレージングコンテンツを包含できる要素 |
可能なコンテンツ | なし(空要素) |
タグの省略 | 開始タグは必須。終了タグはなし。 |
DOMインターフェース | HTMLInputElement |
利用例
以下は、inputを使ったHTMLの例です。
<form method="post" action="test.php"> <input type="text" name="test"> <input type="submit" value="実行"> </form>
上記により、以下のように表示されます。
実行ボタンをクリックすると、name="test"で入力した値が、test=値でtest.phpに送信されます。test.phpでは、データを処理するプログラムが必要です。
typeの型
type属性のキーワードによって、input要素の見た目や機能が大きく異なります。以下に一覧を示します。表示例は、特に説明していない場合は<input type="xxx">とだけ指定したものです。
キーワード | 説明 | 表示例 |
---|---|---|
button | ボタンを表示します。右では、value="ボタン"も指定しています。 | |
checkbox | チェックボックスを表示します。デフォルトの値はonなので、チェックしているとonが送信されます。別の値をvalueで指定することもできます。 | |
color | 色が選択できます。右のコントロールをクリックしてみてください。 | |
date | 日付(年月日)を入力できます。クリックすると、選択できるブラウザもあります。 | |
datetime-local | 日時(年月日と時間)を入力できます。クリックすると、選択できるブラウザもあります。 | |
メールアドレスを入力できます。 | ||
file | ファイルをアップロードする時に使います。 | |
hidden | コントロールを非表示にしますが、データ自体は送信されます。 | |
image | 画像のボタンが表示されます。右では、src属性で画像ファイルも指定しています。 | |
month | 年月日を入力できます。クリックすると、選択できるブラウザもあります。 | |
number | 数値を入力できます。数値を上下させるスピナーが使えるブラウザもあります。 | |
password | 入力値は、●などで隠されます。 | |
radio | ラジオボタンを表示します。nameが同じラジオボタンを複数作成し、どれが選択されているか判別するために使います。デフォルトの値はonですが、データはname=値で送信されるため、ボタンごとに異なる値にすると判別がしやすくなります。また、一般的にラジオボタンは選択が必須のため、checked属性を使って初期状態で選択されている状態にすることも多くあります。右は、2つのコントロールを作っていて、1つを選択状態にしています。 | |
range | 値を選択するためのスライダーを表示します。 | |
reset | リセットボタンを表示します。コントロールの値を初期値に戻します。 | |
search | 検索のためのテキスト入力欄を表示します。 | |
submit | データ送信用のボタンを表示します。クリックすると、サーバーにデータが送信されます。 | |
tel | 電話番号入力のための入力欄を表示します。 | |
text | 文字列入力のための入力欄を表示します。デフォルトです。 | |
time | 時間(時:分)を入力できます。 | |
url | URLを入力できます。 | |
week | 年と週番号(第何週)を入力できます。クリックすると、選択できるブラウザもあります。 |
例えば、urlであれば日本語を入力するとデータを送信できないなど、デフォルト(formnovalidateなどが指定されていない時)ではtypeに応じて検証が行われます。
また、スマートフォンなどではtelであれば数字中心のキーボードになるなど、入力キーボードが変わることがあります。
属性
グローバル属性と、以下が使えます。
- accept
- typeがfileの時、アップロードできるファイル形式を指定します。
- alt
- typeがimageの時で、画像が表示されない時に表示するテキストです。
- autocomplete
- 一度入力した内容を覚えて、次回入力時の選択肢(例えば、住所を何度も入力しなくて済む)としたり、自動的に入力済にしたりする機能(自動補完機能)のon、offを設定します。デフォルトは、on(有効)です。
- checked
- typeがcheckboxとradioの時に使います。trueにすると、ページが表示された時にチェックされた状態になります。
- dirname
- 書式方向(左から記述するなど)を示す時に使う名前を指定します。
- disabled
- 入力やクリックなどができないようになります。
- form
- formのIDを指定して、form要素と関連付けします。
- formaction
- データ送信先のURLを指定します。formのaction属性より優先されます。
- formenctype
- データを送信する時のエンコーディングタイプを指定します。formのenctype属性より優先されます。
- formmethod
- データを送信する方法(メソッド)を指定します。formのmethod属性より優先されます。
- formnovalidate
- 内容を検証しないようにします。例えば、入力が必須のテキスト入力欄だった場合でも、入力しなくてもデータを送信可能になります。formのnovalidate属性より優先されます。
- formtarget
- サーバーにデータを送信した後の画面(例えば、受付完了画面など)を表示する、タブやウィンドウなどを指定します。formのtarget属性より優先されます。
- height
- typeがimageの時で、画像の高さを指定します。
- list
- datalist要素のIDを指定し、入力値の候補から選択できるようになります。
- max
- 入力値が数字などの場合、最大値を指定します。
- maxlength
- 入力できる最大文字数を指定します。
- min
- 入力値が数字などの場合、最小値を指定します。
- minlength
- 入力時の最小文字数を指定します。
- multiple
- typeがemailやfileの時、カンマで区切って複数入力・選択できるようになります。
- name
- 名前です。HTML内で一意である必要があります。データ送信時に、名前=データの形で送信されます。名前がないとデータが送信されません。
- pattern
- 送信できるデータのパターンを指定します。正規表現も可能です。
- placeholder
- 入力欄に、ヒントを表示します。titleが詳細な説明をするのに対し、placeholderは簡易的な説明で改行も利用できません。
- readonly
- 読み取り専用になります。入力などはできません。
- required
- 入力や選択などが必須になります。
- size
- 横の大きさを、文字数などで示します。デフォルトは、20です。
- src
- typeがimageの時、画像のファイル名を指定します。
- step
- 入力する値の粒度を指定します。例えば、自然数しか使えないか、小数点以下が使えるかなどです。
- type
- データのタイプを指定します。
- value
- データの値を示します。nameとvalueが対となって(name=valueの形で)データが送信されます。
- width
- typeがimageの時で、画像の横幅を指定します。
次からは、各属性の利用例を示します。また、typeごとに使える属性が異なるため、最後にtypeと属性の関係を示します。
accept属性の利用例
accept属性の利用例は、以下のとおりです。
<input type="file" name="test" accept="image/*,.pdf">
上記により、デフォルトでは画像とPDFファイルが選択可能になります。
指定は、以下が行えます。
値 | 説明 |
---|---|
audio/* | 音声ファイル |
video/* | 動画ファイル |
image/* | 画像ファイル |
.pdf、.doc、.pngなど | 拡張子に対応したファイル |
application/zipなど | MIMEタイプ |
複数指定する時は、カンマで区切って指定します。
alt属性の利用例
alt属性の利用例は、以下のとおりです。
<input type="image" src="image.png" alt="説明用のボタン画像">
img要素のaltと、使い方は同じです。
autocomplete属性の利用例
autocomplete属性の利用例は、以下のとおりです。
<input type="text" name="test" autocomplete="off">
上記により、自動補完が無効になります。
checked属性の利用例
checked属性の利用例は、以下のとおりです。
<input type="checkbox" name="test1" checked><label for="test1">りんご</label> <input type="checkbox" name="test2"><label for="test2">みかん</label>
上記は、以下のように表示されます。
初期状態で、りんごが選択されています。ラジオボタンでも同様に使えます。
dirname属性の利用例
dirname属性の利用例は、以下のとおりです。
<input type="text" name="test" dirname="test.dir">
上記により、日本語であればtest=値とtest.dir=ltrの組み合わせ(ltrは左から記述を示す)でデータが送信されます。アラビア語のように、右から記述する言語ではrtlになります。
disabled属性の利用例
disabled属性の利用例は、以下のとおりです。
<input type="text" name="test" disabled>
上記は、以下のように表示されます。
通常より薄く表示されていて、入力できないことがわかるようになっています。
form属性の利用例
form属性の利用例は、以下のとおりです。
<form method="post" action="test.php" id="test"> <input type="text" name="test"> </form> <input type="submit" value="実行" form="test">
最後のinputはform要素の外にありますが、赤字のようにform要素のIDで指定した名前と、form属性で指定した値が一致していると、指定したform要素のactionやmethodで動作します。
formaction属性の利用例
formaction属性の利用例は、以下のとおりです。
<form method="post" action="test.php"> <input type="text" name="test"> <input type="submit" value="実行" formaction="test2.php"> </form>
上記により、form要素で指定したtest.phpより優先して、test2.phpへ送信します。
formenctype属性の利用例
formenctype属性の利用例は、以下のとおりです。
<form method="post" action="test.php" enctype="multipart/form-data"> <input type="text" name="test"> <input type="submit" value="送信" formenctype="application/x-www-form-urlencoded"> </form>
上記により、form要素で指定したエンコーディングタイプを上書きします。
formenctypeには、以下の値が使えます。
値 | 説明 |
---|---|
application/x-www-form-urlencoded | データをURLエンコードします。デフォルトです。 |
multipart/form-data | inputでtypeがfileの時に使います。 |
text/plain | エンコードせずにテキスト形式で送信します。 |
formmethod属性の利用例
formmethod属性の利用例は、以下のとおりです。
<form method="post" action="test.php"> <input type="text" name="test"> <input type="submit" value="送信" formmethod="get"> </form>
上記により、form要素で指定したメソッドより優先されます。
formnovalidate属性の利用例
formnovalidate属性の利用例は、以下のとおりです。
<form method="post" action="test.php"> <input type="url" name="test"> <input type="submit" value="送信1"> <input type="submit" value="送信2" formnovalidate> </form>
typeがurlの場合、入力文字の検証がされます。
「送信1」ボタンはこの検証を行うため、日本語などが入力された場合は「URLを入力してください。」などと表示されて、データは送信されません。
「送信2」ボタンはこの検証を行わないため、日本語などが入力された場合でもデータが送信されます。
formtarget属性の利用例
formtarget属性の利用例は、以下のとおりです。
<form method="post" action="test.php" target="_blank"> <input type="text" name="test"> <input type="submit" value="送信" formtarget="_self"> </form>
form要素では、データ送信後の画面は別タブで表示するようにtarget指定していますが、_selfが優先されます。
formtargetでは、指定した名前の他に、以下の値が使えます。
値 | 説明 |
---|---|
_self | 現在の表示タブ(デフォルト) |
_blank | 新しいタブ |
_parent | 現在のタブを開く元となったタブ |
_top | 現在のタブを開く元となったタブをたどった一番元のタブ |
名前 | iframeのnameで指定した名前 |
タブは、ブラウザの設定によっては新しいウィンドウで開きます。
height属性の利用例
height属性の利用例は、以下のとおりです。
<input type="image" src="image.png" alt="説明用のボタン画像" height="16">
上記により、画像ボタンの高さを16pxにして表示します。
list属性の利用例
list属性の利用例は、以下のとおりです。
<input type="text" name="test" list="fruit"> <datalist id="fruit"> <option value="りんご"> <option value="みかん"> </datalist>
上記により、以下のように表示されます。
入力欄を2回クリックすると、りんごとみかんが選択できるようになります。
max属性の利用例
max属性の利用例は、以下のとおりです。
<input type="number" name="test" max="10">
上記により、10を超える数値を入力すると、検証によってデータが送信できなくなります。
maxlength属性の利用例
maxlength属性の利用例は、以下のとおりです。
<input type="text" name="test" maxlength="10">
上記により、10文字を超えて入力できなくなります。
min属性の利用例
min属性の利用例は、以下のとおりです。
<input type="number" name="test" min="10">
上記により、10より小さい数値を入力すると、検証によってデータが送信できなくなります。
minlength属性の利用例
minlength属性の利用例は、以下のとおりです。
<input type="text" name="test" minlength="10">
上記により、10文字未満の文字数の場合、検証によってデータが送信できなくなります。
multiple属性の利用例
multiple属性の利用例は、以下のとおりです。
<input type="email" name="test" multiple>
上記により、メールアドレスをカンマ(,)で区切って複数入力することができるようになります。もし、multipleを付けずにカンマで区切って入力しても、検証によってデータは送信されません。
name属性の利用例
name属性の利用例は、以下のとおりです。
<input type="text" name="test">
上記により、データはtest=入力した値で送信されます。
また、nameで指定した名前はJavaScriptでも使えます。
<form name="form1"> <input type="text" name="test"> <input type="button" value="実行" id="test1"> </form> <script> const x = document.querySelector("#test1"); x.addEventListener("click", function(){alert(document.form1.test.value);}); </script>
上のinputで「テストです。」と入力したとします。下のinputのボタンをクリックすると、アラートで「テストです。」と表示されます。document.form1に続くtestが、nameで作成した名前を示しているためです。
pattern属性の利用例
pattern属性の利用例は、以下のとおりです。
<input type="text" name="test" pattern="[A-Za-z]+">
上記により、英大文字か小文字以外が入力されると、以下のように表示されます。
検証によって「指定されている形式で入力してください。」と表示されて、データは送信されません。
なお、title属性などで入力可能な文字を説明するなど、補足することが推奨されます。
placeholder属性の利用例
placeholder属性の利用例は、以下のとおりです。
<input type="search" name="test" placeholder="検索">
上記は、以下のように表示されます。
入力欄に、薄く「検索」と表示されています。
readonly属性の利用例
readonly属性の利用例は、以下のとおりです。
<input type="text" name="test" value="テストです" readonly>
上記は、以下のように表示されます。
書き込みできないのが、わかると思います。
required属性の利用例
required属性の利用例は、以下のとおりです。
<input type="text" name="test" required>
上記により、値が入力されていない時に実行すると、以下のように表示されます。
検証によって「このフィールドを入力してください。」と表示されて、データを送信できません。
size属性の利用例
size属性の利用例は、以下のとおりです。
<input type="text" name="test" size="10">
上記により、10文字分の表示ができる横幅で表示されます。表示の幅なので、文字は10文字以上入力できます。思ったとおりの横幅にならないことも多いため、CSSでwidth:10emなどと指定することをお薦めします。
src属性の利用例
src属性の利用例は、以下のとおりです。
<input type="image" src="image.png" alt="説明用のボタン画像">
img要素のsrcと、使い方は同じです。
step属性の利用例
step属性の利用例は、以下のとおりです。
<input type="number" name="test" step="0.1">
上記により、0.1単位で数値を入力できますが、0.01などを入力すると検証によってデータが送信できなくなります。
もし、100.11などの数値を入力すると、以下のように表示されます。
この場合、検証によってデータは送信されません。
value属性の利用例
value属性の利用例は、以下のとおりです。
<input type="text" name="test" value="テストです。">
上記は、以下のように表示されます。
最初から、「テストです。」と入力された状態になります。readonly属性が指定されていなければ、書き換えることは可能です。
width属性の利用例
width属性の利用例は、以下のとおりです。
<input type="image" src="image.png" alt="説明用のボタン画像" width="16">
上記により、画像ボタンの横幅を16pxにして表示します。
typeと属性の関係
typeによって、使える属性が決まっています。以下は、対応表です。
属性 | hidden | text, search |
url, tel |
password | |
---|---|---|---|---|---|
accept | - | - | - | - | - |
alt | - | - | - | - | - |
autocomplete | 〇 | 〇 | 〇 | 〇 | 〇 |
checked | - | - | - | - | - |
dirname | - | 〇 | - | - | - |
form* | - | - | - | - | - |
height | - | - | - | - | - |
list | - | 〇 | 〇 | 〇 | - |
max | - | - | - | - | - |
maxlength | - | 〇 | 〇 | 〇 | 〇 |
min | - | - | - | - | - |
minlength | - | 〇 | 〇 | 〇 | 〇 |
multiple | - | - | - | 〇 | - |
pattern | - | 〇 | 〇 | 〇 | 〇 |
placeholder | - | 〇 | 〇 | 〇 | 〇 |
readonly | - | 〇 | 〇 | 〇 | 〇 |
required | - | 〇 | 〇 | 〇 | 〇 |
size | - | 〇 | 〇 | 〇 | 〇 |
src | - | - | - | - | - |
step | - | - | - | - | - |
width | - | - | - | - | - |
属性 | date, month, week, time |
datetime- local |
number | range | color |
---|---|---|---|---|---|
accept | - | - | - | - | - |
alt | - | - | - | - | - |
autocomplete | 〇 | 〇 | 〇 | 〇 | 〇 |
checked | - | - | - | - | - |
dirname | - | - | - | - | - |
form* | - | - | - | - | - |
height | - | - | - | - | - |
list | 〇 | 〇 | 〇 | 〇 | 〇 |
max | 〇 | 〇 | 〇 | 〇 | - |
maxlength | - | - | - | - | - |
min | 〇 | 〇 | 〇 | 〇 | - |
minlength | - | - | - | - | - |
multiple | - | - | - | - | - |
pattern | - | - | - | - | - |
placeholder | - | - | 〇 | - | - |
readonly | 〇 | 〇 | 〇 | - | - |
required | 〇 | 〇 | 〇 | - | - |
size | - | - | - | - | - |
src | - | - | - | - | - |
step | 〇 | 〇 | 〇 | 〇 | - |
width | - | - | - | - | - |
属性 | checkbox, radio |
file | submit | image | reset, button |
---|---|---|---|---|---|
accept | - | 〇 | - | - | - |
alt | - | - | - | 〇 | - |
autocomplete | - | - | - | - | - |
checked | 〇 | - | - | - | - |
dirname | - | - | - | - | - |
form* | - | - | 〇 | 〇 | - |
height | - | - | - | 〇 | - |
list | - | - | - | - | - |
max | - | - | - | - | - |
maxlength | - | - | - | - | - |
min | - | - | - | - | - |
minlength | - | - | - | - | - |
multiple | - | 〇 | - | - | - |
pattern | - | - | - | - | - |
placeholder | - | - | - | - | - |
readonly | - | - | - | - | - |
required | 〇 | 〇 | - | - | - |
size | - | - | - | - | - |
src | - | - | - | 〇 | - |
step | - | - | - | - | - |
width | - | - | - | 〇 | - |
ブラウザのサポート状況(type)
各ブラウザの最新バージョンでのtypeサポート状況は、以下のとおりです。
項目 | IE | Ed | Fx | Ch | Sa | Op |
---|---|---|---|---|---|---|
input | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
button | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
checkbox | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
color | × | 〇 | 〇 | 〇 | 〇 | 〇 |
date | × | 〇 | 〇 | 〇 | × | 〇 |
datetime-local | × | 〇 | × | 〇 | × | 〇 |
〇 | 〇 | 〇 | 〇 | 〇 | 〇 | |
file | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
hidden | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
image | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
month | × | 〇 | × | 〇 | × | 〇 |
number | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
password | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
radio | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
range | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
reset | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
search | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
submit | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
tel | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
text | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
time | × | 〇 | 〇 | 〇 | × | 〇 |
url | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
week | × | 〇 | × | 〇 | × | 〇 |
項目 | Sa | An | Op | Ch | Fx | Sm |
---|---|---|---|---|---|---|
input | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
button | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
checkbox | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
color | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
date | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
datetime-local | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
〇 | ? | 〇 | ? | 〇 | ? | |
file | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
hidden | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
image | 〇 | 〇 | 〇 | ? | 〇 | ? |
month | 〇 | 〇 | 〇 | 〇 | × | 〇 |
number | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
password | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
radio | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
range | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
reset | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
search | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
submit | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
tel | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
text | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
time | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
url | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
week | × | 〇 | 〇 | 〇 | 〇 | 〇 |
- 〇
- サポート
- △
- 制限あり
- ×
- 未サポート
- ?
- 不明
- IE
- Internet Explorer
- Ed
- Edge
- Fx
- Firefox
- Ch
- Chrome
- Sa
- Safari
- Op
- Opera
- An
- Android Browser
- Sm
- Samsung Internet
※スマートフォンのFirefoxとChromeは、Android版です。
ブラウザのサポート状況(属性)
各ブラウザの最新バージョンでの属性サポート状況は、以下のとおりです。
項目 | IE | Ed | Fx | Ch | Sa | Op |
---|---|---|---|---|---|---|
accept | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
alt | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
autocomplete | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
checked | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
dirname | × | 〇 | × | 〇 | 〇 | 〇 |
disabled | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
form | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formaction | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formenctype | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formmethod | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formnovalidate | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formtarget | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
height | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
list | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
max | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
maxlength | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
min | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
minlength | × | 〇 | 〇 | 〇 | 〇 | 〇 |
multiple | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
name | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
pattern | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
placeholder | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
readonly | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
required | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
size | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
src | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
step | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
type | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
value | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
width | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
項目 | Sa | An | Op | Ch | Fx | Sm |
---|---|---|---|---|---|---|
accept | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
alt | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
autocomplete | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
checked | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
dirname | 〇 | 〇 | 〇 | 〇 | × | 〇 |
disabled | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
form | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formaction | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formenctype | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formmethod | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formnovalidate | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
formtarget | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
height | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
list | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
max | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
maxlength | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
min | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
minlength | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
multiple | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
name | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
pattern | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
placeholder | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
readonly | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
required | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
size | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
src | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
step | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
type | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
value | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
width | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 |
- 〇
- サポート
- △
- 制限あり
- ×
- 未サポート
- ?
- 不明
- IE
- Internet Explorer
- Ed
- Edge
- Fx
- Firefox
- Ch
- Chrome
- Sa
- Safari
- Op
- Opera
- An
- Android Browser
- Sm
- Samsung Internet
※スマートフォンのFirefoxとChromeは、Android版です。
「HTML要素(タグ)一覧」に戻る