パスワード形式の入力欄を作る

[新着] Webテンプレートを仮オープンしました


<input type="password">

ブラウザ
Internet Explorer Netscape Firefox Opera
タイプ
置換インライン 空要素

inputタグtype="password" を指定すると、パスワード形式の入力欄を作成できます。入力した内容は、アスタリスク( * )などで表示されます。


<input type="password" name="pass">

<input type="password" name="pass" size="30" maxlength="30">


name="" フィールド名を指定します(一般的には半角英数字)
size="" 入力フィールドの横幅を数値で指定します
maxlength="" 入力できる最大文字数を指定します
value="" 入力フィールドに文字を挿入しておきます

name="" (フィールド名を指定する)

入力項目を判別するための名前です。項目ごとに違う名前を指定します。

size="" (入力フィールドの横幅を指定する)

入力欄の横幅を数値で指定します。
サイズを指定した場合でも、ブラウザにより見た目の長さは異なります。同じような長さで表示したい場合は、スタイルシートで指定します。

maxlength="" (入力できる最大文字数を指定する)

入力できる最大文字数を指定します。
例えば maxlength="10" を指定した場合、11文字以降の文字は入力できなくなります。

value="" (入力フィールドに文字を挿入しておく)

入力欄に文字を入れておきたい場合に指定します。
この指定で挿入した内容も、アスタリスク( * )などで表示されます。

メモ

入力欄のサイズや背景色等は、スタイルシートでアレンジすることもできます。指定方法の詳細は「関連ページ」をご覧ください。


使用例

<form method="POST" action="example.cgi">

<p>
標準
<br>
<input type="password" name="example1">
</p>

<p>
横幅を40に指定
<br>
<input type="password" name="example2" size="40">
</p>

<p>
最大文字数を10に指定
<br>
<input type="password" name="example3" size="40" maxlength="10">
</p>

<p>
文字を入れておく
<br>
<input type="password" name="example4" size="40" value="test">
</p>

<p><input type="submit" value="送信する"></p>

</form>

これをブラウザで見ると次のように表示されます

標準

横幅を40に指定

最大文字数を10に指定

文字を入れておく

※サンプルのため送信できません



[特集] レンタルサーバー比較 & サーバー選びのチェックポイント

サイト内検索について - ベーシック版