レジェンドタグ

6308 ワード
htmll learnhtml テキストリンク
凡例タグは、HTMLドキュメント内の親要素のキャプションまたはタイトルを定義するために使用されます.タグの最初の子要素です.タグは要素のキャプションを割り当てるために使用されます.
このタグは、

-見出し

タグ.要素を持つタグを使用することで、グループ化されたフォーム要素の目的を理解しやすくなります.
推定読書時間:4分

文法


このタグは開始タグと終了タグの両方を含んでいます.これらの2つのタグの間に内容が書き込まれます.

<legend> Title </legend>

HTMLタグの特徴


th, td{ padding: 20px; }
△HTMLタグは内容のキャプションを表す
内容コンテンツカテゴリー
コンテンツの内容と見出し(h 1 - h 6要素)
△タグ省略なし.
そして、それはタグの最初の子要素です
無意味アリアの役割
アレの役割は許されなかった.
チェンインターフェース

HTMLタグのサンプル



<!DOCTYPE html>
<html>
  <head>
    <title>HTML <legend> Tag</title>
  </head>
  <body>
<h2>Example of HTML <legend> Tag</h2>
    <form>
      <fieldset>
        <legend>Personal Information:</legend>
        First Name:
        <input type="text">
        <br>
    <br> Last Name:
        <input type="text">
        <br>
        <br> E-mail ID:
        <input type="email">
        <br>
        <br> Date of Birth:
        <input type="number">
        <br/>
        <br/> Birth Place:
        <input type="text">
      </fieldset>
    </form>
  </body>
</html>

結果:


結果

サンプルファイルをダウンロード


HTML-legend-tag Download

CSSプロパティを使用してスタイルをHTMLタグ


CSSスタイリングプロパティを使用して、凡例の最初の外観を変更することもできます.

CSSによるHTMLタグのサンプル



<!DOCTYPE html>
<html>
  <head>
    <title>HTML <legend> Tag</title>
    <style>
      form {
        width: 55%;
      }
      fieldset {
        padding: 25px;
      }
      label {
        display: inline-block;
        width: 95px;
        text-align: right;
      }
      legend {
        display: block;
        padding: 15px;
        margin-bottom: 10px;
        background-color: #43156D;
        color: white;
      }
    </style>
  </head>
  <body>
   <h2>Example of HTML <legend> Tag with CSS</h2>
    <form>
      <fieldset>
        <legend>Personal data:</legend>
        <label>Name:</label>
        <input type="text">
        <br/>
        <br/>
        <label>E-mail:</label>
        <input type="email">
        <br/>
        <br/>
        <label>Date of birth:</label>
        <input type="number">
        <br/>
        <br/>
        <label>Birth Place:</label>
        <input type="text">
      </fieldset>
    </form>
  </body>
</html>

結果:


結果

属性


HTML凡例タグはグローバル属性とイベント属性をサポートします.
th, td{ padding: 20px; }
属性
値
説明
整列する
  • トップ
  • 底
  • 左側
  • 右
    この値はキャプションの位置を定義するのに役立ちます.HTML 5でサポートされていません.

    • タグのスタイリングメソッド


    次のプロパティを使用してHTML凡例タグをスタイルできます.

    スタイルのプロパティ-タグのテキストの視覚的な重み/強調/サイズ


  • CSSのフォントスタイル-このCSSプロパティは、通常の、斜体、斜め、初期、継承などのテキストのフォントスタイルを設定するのに役立ちます.

  • CSSフォントファミリー-このCSSプロパティは、選択された要素の1つ以上のフォントファミリー名またはジェネリックファミリ名の優先順位付きリストを指定します.

  • CSSのフォントサイズ-このCSSプロパティは、フォントのサイズを設定するのに役立ちます.

  • CSSフォントウェイト-このCSSプロパティは、フォントが太字であるか太いかどうかを定義するために使用します.

  • CSSテキスト変換-このCSSプロパティは、テキストケースと資本化を制御します.

  • このCSSプロパティは、テキストの装飾線、テキストの装飾色、テキストの装飾スタイルなどのテキストに追加された装飾を指定します.

    • タグのテキストを着色するスタイル


  • このCSSプロパティは、テキストコンテンツと装飾の色を指定します.

  • このCSSプロパティは、要素の背景色を設定するのに役立ちます.

    • タグのテキストレイアウトスタイル


  • このCSSプロパティは、テキストブロック内の最初の行のインデントを指定するために使用されます.
  • *このCSSプロパティは、表示されていないオーバーフローされたコンテンツがどのようにユーザーに通知されるかを記述するのに役立ちます.

  • CSSホワイトスペース-このCSSプロパティは、要素内の空白がどのように扱われるかを説明します.

  • CSSの単語ブレイク-このCSSプロパティは、行が壊れている場所を決定します.

    • タグの他のプロパティー


  • CSSのテキストの影-このCSSプロパティは、テキストに影を追加するのに役立ちます.

  • CSS text align last -このCSSプロパティはテキストの最後の行の位置を設定します.

  • このCSSプロパティは、線の高さを定義します.

  • CSS文字間隔-このCSSプロパティは、テキスト内の文字/文字間の空白を決定するのに役立ちます.

  • このCSSプロパティは、すべての単語の間隔を指定します.

    • ブラウザサポート:


    ブラウザサポート

    関連記事

  • HTML Caption Tag
  • HTML
    Figure Caption Tag
  • Basic HTML Definitions and Usages in the Real World
  • HTML Figure Tag
  • HTML Code Tag
    • 郵便HTML Legend Tag appeared first on Share Point Anchor.
    imagemagickのインストール方法
    ディレクターが社内ハッカソンでコード書いてみて業務がどう変わったか