(例)input type=”email”の使用方法
See the Pen
input by linlin (@linlin098765)
on CodePen.
<form action="◯◯.php" method="post">
<input type="hidden" value="test" name="hidden">
<p>url:<input type="url" name="url"></p>
<p>tel:<input type="tel" name="tel"></p>
<p>serch:<input type="search" name="search"></p>
<p>image:<input type="image" name="image" src="◯◯.jpg" alt="テキスト"></p>
<p>file:<input type="file" name="file"></p>
<p>color:<input type="color" name="color"></p>
<p>range:<input type="range" name="range"></p>
<p>number:<input type="number" name="number"></p>
<p>datetime-local:<input type="datetime-local" name="datetime-local"></p>
<p>time:<input type="time" name="time"></p>
<p>week:<input type="week" name="week"></p>
<p>month:<input type="month" name="month"></p>
<p>date:<input type="date" name="date"></p>
<p>datetime:<input type="datetime" name="datetime"></p>
<p>password:<input type="password" name="password"></p>
<p>email:<input type="email" name="email"></p>
<p>ボタン:<input type="button" name="button" value="ボタン"></p>
</form>
<form action="◯◯.php" method="post">
<input type="hidden" value="test" name="hidden">
<p>url:<input type="url" name="url"></p>
<p>tel:<input type="tel" name="tel"></p>
<p>serch:<input type="search" name="search"></p>
<p>image:<input type="image" name="image" src="◯◯.jpg" alt="テキスト"></p>
<p>file:<input type="file" name="file"></p>
<p>color:<input type="color" name="color"></p>
<p>range:<input type="range" name="range"></p>
<p>number:<input type="number" name="number"></p>
<p>datetime-local:<input type="datetime-local" name="datetime-local"></p>
<p>time:<input type="time" name="time"></p>
<p>week:<input type="week" name="week"></p>
<p>month:<input type="month" name="month"></p>
<p>date:<input type="date" name="date"></p>
<p>datetime:<input type="datetime" name="datetime"></p>
<p>password:<input type="password" name="password"></p>
<p>email:<input type="email" name="email"></p>
<p>ボタン:<input type="button" name="button" value="ボタン"></p>
</form>
input type=”email”とは?-HTML
input type=”email”は、メールアドレスの入力欄を作成するタグです。
type=”text”と同様のテキスト欄が作成されます。type=”text”でも代替可能です。type=”email”だからと言って、emailか判別するかどうかはブラウザの仕様で決まります。
name属性はformデータをサーバー側へ送信した際に必要なため指定してください。size属性により入力欄の表示サイズを指定できますが、CSSでも調整できるため必須ではありません。maxlength属性は入力できる最大文字数を指定することが可能です。