HTMLのformタグとは?

HTMLのformタグとは?

「FORM」とは、入力・送信フォームを作成する際に使用する要素です。HTMLにおいて、<form>タグはひとつのフォームのコンテナを構成します。このタグの中にさまざまな種類のフォーム部品を配置することで、ユーザーから情報を入力してもらうフォームを作成します。

基本的なフォームの作成

基本的なフォームには、ユーザーからの情報を収集するためのさまざまな入力フィールドが含まれます。以下のような要素が一般的です:

  • <input>: テキストやボタンの入力を可能にする。
  • <select>: プルダウンメニューを作成する。
  • <textarea>: 長文入力を可能にする。

HTMLフォームの例

以下に基本的なHTMLフォームの例を示します。このフォームには、ユーザー名、パスワード、好みの色の選択、そしてコメントが含まれます。


<form action="submit_form.php" method="post">
    <label for="username">ユーザー名:</label>
    <input type="text" id="username" name="username" required><br>

    <label for="password">パスワード:</label>
    <input type="password" id="password" name="password" required><br>

    <label for="color">好きな色:</label>
    <select id="color" name="color">
        <option value="red">赤</option>
        <option value="green">緑</option>
        <option value="blue">青</option>
    </select><br>

    <label for="comments">コメント:</label>
    <textarea id="comments" name="comments"></textarea><br>

    <input type="submit" value="送信">
</form>

フォームタグの属性

フォームタグにはいくつかの重要な属性があります:

属性 説明
action フォームのデータを送信するURLを指定します。
method データ送信に使用するHTTPメソッドを指定します。通常はgetまたはpostのどちらかを使用します。
enctype ファイルアップロード時に使われます。multipart/form-dataが一般的です。

以上が基本的なHTMLの<form>タグに関する説明と活用例です。この要素を用いることで、ウェブページにインタラクティブなフォームを簡単に組み込むことができます。

その他の参考記事: