legend

タグの概要

legendタグは、フォームのfieldset要素内で使用され、そのフォームのタイトルや説明文を定義します。legend要素は、ユーザーに対してフォーム内のコンテンツに関する情報を提供する役割を持ちます。

フォーム内のセクションごとにタイトルや説明文を表示したい場合に使用されます。

基本の書き方（構文）

<fieldset>
  <legend>Contact Information</legend>
  <label for="name">Name:</label>
  <input type="text" id="name" name="name">
  <label for="email">Email:</label>
  <input type="email" id="email" name="email">
</fieldset>

主な属性とその説明

特定の属性はlegend要素にはありません。

使用例

<form>
  <fieldset>
    <legend>Shipping Information</legend>
    <label for="address">Address:</label>
    <input type="text" id="address" name="address">
    <label for="city">City:</label>
    <input type="text" id="city" name="city">
  </fieldset>
</form>

<form>
  <fieldset>
    <legend>User Details</legend>
    <label for="username">Username:</label>
    <input type="text" id="username" name="username">
    <label for="password">Password:</label>
    <input type="password" id="password" name="password">
  </fieldset>
</form>

よくある注意点・間違い

legend要素は、fieldset要素内で使用されることが適切です。fieldset要素を使用しない場合にlegend要素を単独で使用するのは適切ではありません。また、フォームのタイトルや説明文を表すために使用されることを念頭に置いて適切に使うことが重要です。