HTML

【HTML基礎】頻出!よく使うformタグの属性について簡単にまとめてみた!

HTML

 

今回はフォームを生成するタグ「formタグ」の属性の中でも、よく使われる属性について解説したいと思います。この機会にformタグを使いこなして様々なフォームを作れるようになりましょう。

そもそもformタグとは

フォーム

formタグとは、上記のようなフォームを作るためのHTML構造です。

formタグの中にも、

  • textareaタグ
  • inputタグ
  • selectタグ
  • labelタグ

があります。

作りたいフォームによってタグを使い分けてね!

formタグの属性

それでは本題のformタグの属性について説明していきます。

まずは例を見ていきましょう。

<form method="POST" action="techtechmedia.com">
  <p>名前<input type="text" name="NAME"></p>
  <p>メールアドレス:<input type="text" name="email"></p>
  <p><input type="submit" value="送信"></p>
  <p><input type="reset" value="取消"></p>
</form>

 

ここで使われている属性は、

  • method属性
  • action属性
  • name属性

です。

これらの属性は必ずと言っていいほど、formで使われます。

それでは順番に見ていきましょう。

method属性

サーバーにデータを送る形式(HTTPメソッド)を GET または POST で指定します。

action属性

フォームデータの送信先URLを指定します。

name属性

フォームの名前を指定する属性です。

これらの他にも、「enctype属性」「accept-charset属性」、「accept属性」、「target属性」などがあります。

まとめ

  • formタグとはフォームを生成するためのタグ
  • よく使われる属性には「method属性、action属性、name属性」がある

 

 

今回はformタグの属性の中でもよく使われる属性について解説しました。フォームを作るためには様々なタグや属性を使いこなす必要があるので、この機会にしっかりマスターしていきましょう。