HTMLコアのクリーンアップ

5233 ワード

更新21.03.22

HTMLデフォルト構文


HTMLの基本文法は簡単です.
**<Tag> Contents </Tag> **
上記の形式でラベルを交換するだけです.
前のラベルを開いたラベル、後ろのラベルを閉じたラベルと呼びます.
また、タグにはタグを使用できるので、親要素と子要素に分けることができます.
<Tag1>
  <Tag2> Contents </Tag2>
</Tag1>
Tag 1は親要素、Tag 2は子要素と呼ばれます.
この場合、複数行合成の場合は、要素間の区切りをインデント、イントラライトで行う必要があります.
親要素の親要素がある場合は、親(親)要素と呼ばれます.
逆に、サブエレメントのサブエレメントがある場合は、子孫(サブ)エレメントと呼ばれます.
<Tag1>
  <Tag2>
    <Tag3> Contents <Tag3>
  </Tag2>
</Tag1>
上記の例に基づいて、
Tag 1はTag 3の親要素となる.
Tag 3はTag 1の子孫となる.
HTMLには、単純な構文を補助する属性と値があります.
<Tag Attr="Value"> Contents </Tag>
属性と値は、上述した形式で使用することができ、代表的な例はimgタグである.
<img src="./example.jpg" alt="예제" />
しかし、imgラベルは少しおかしいのではないでしょうか.
開いたタグ-閉じたタグのペアがあり、imgタグには開いていないタグがあります.
これらのラベルは「空のラベル」と呼ばれています.
空のラベルの形式は、ラベルを開くか閉じるかです.
HTML 5仕様では、常に空のラベルを使用するときに閉じたラベルを使用することを推奨します.
厳密なHTMLチェックでラベルが閉じていないとエラーが発生するためです.
これに対して、空のラベルを使用するときにラベルを閉じる習慣をできるだけ身につけなければならない.

行内要素vsブロック要素


HTMLの要素(タグ)は、行内要素とブロック要素に分けることができます.
行内要素は、テキストを作成するために使用される要素で、コンテンツサイズの一部のみを占めます.
次の図に示すように、「Hello World」文字列は、対応するスペースだけを占めて行内要素です.
また,入力された内容は水平集積の特徴である.
代表的な行内要素にはspanタグがあります.
<span>Hello</span> <span>World</span>
ブロック要素は、主にレイアウトを作成するために使用されるコンテンツ領域の設定に使用されます.
「Hello World」文字列のスペースは次のとおりです.
要素はすべての拡張可能な分野を占めている.
また、行の要素とは異なり、要素が垂直に積み重ねられていると判断できます.

これらの行の要素、ブロック要素のフィーチャーを使用してレイアウトを作成します.
コンテンツ作成後、CSSを使用して適切な修飾を行い、JSを使用して動的移動を構成してWebを構成します.