合宿免許の免許とるネット
HOME >> HTML > 一行のテキストボックス

point 一行のテキストボックス

<INPUT type="text" name="テキストボックスにつける名前">
1行だけのテキストボックスを作るには、<INPUT>タグにtype属性をつけて値にtextを指定します。それと、name属性でこのテキストボックスに名前を指定します。前述したようにフォームは主にCGIなどで使われます。記入内容を送信した時に、どの入力欄に記入されたデータなのかをプログラムが判断出来るように、必ずname属性を記入して名前を指定して下さい。
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)
ソース
<FORM>
<INPUT type="text" name="namae">
</FORM>

point テキストボックスの横幅

<INPUT type="text" size="数値">
テキストボックスの横幅を指定するには、size属性を使います。何も指定しない場合は、size="20"を指定した場合と同じ横幅になります。
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)
size="30"の場合

size="40"の場合
ソース
<FORM>
size="30"の場合<br>
<INPUT type="text" size="30" name="po">
<br>
size="40"の場合<br>
<INPUT type="text" size="40" name="ho">
</FORM>

point 初めからテキストを表示

<INPUT type="text" value="テキストボックスに表示される文字">
テキストボックスに初めから文字を表示させることが出来ます。value属性の値に表示させたいテキストを指定します。
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)
ソース
<FORM>
<INPUT type="text" value="http://" name="po">
</FORM>

point 入力できる文字数を指定する

<INPUT type="text" maxlength="指定文字数">
テキストボックスに入力する文字数を制限することも出来ます。
<INPUT>タグにmaxlength属性をつけて値に上限の文字数を記入します。サンプルのテキストボックスは、5文字しか記入できません。
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)
ソース
<FORM>
<INPUT type="text" maxlength="5" name="hi">
</FORM>

point 読み取り専用にする

<INPUT type="text" name="テキストボックスにつける名前" readonly>
テキストボックスにJavaScriptを使ってメーセージを表示する場合など、特に何も記入する必要がない場合、<INPUT>タグにreadonly属性を付けることで、読み取り専用にすることが出来ます。
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)
ソース
<FORM>
<INPUT type="text" name="namae" value="書けないでしょ" readonly>
</FORM>
Copyright ©2001〜2011 まさぼ〜 All Right Reserved