WEB制作の備忘録|朧なる足痕

HTMLのマークアップについて

(2020-04-16 復習)

用語

  • HTML = HyperText Markup Language
  • DTD宣言 = Document Type Definition = 文書 種類 定義
  • UA = user agent Webサイトを見る時に使用するデバイスのこと
  • <> = angle brackets = アングル ブラケット = 角度 括弧
  • [ ] = brackets = ブラケット
  • { } = curl brackets = カールブラケット(ブレース)
  • 見出し:優先順位、font-size:大きさ
    • Q:なぜフォントサイズは7なのに、見出しはh6までなのか
    • A:見出し+本文が必ずセットのため7となる。
  • meta = metaphor = 隠喩、例え

マークアップ要素

ブロック要素

ブロック要素の中にブロック要素/インライン要素の両方入れられるが、
インライン要素にブロック要素は入れなれない。

  • h1〜h6 = headline = 見出し = 本文を章立てする見出し用のタグ
  • p = paragraph = 段落
  • ul = unorder list = 箇条書リスト(順不同)
  • ol = order list = 箇条書リスト
    • ul+li/ol+li:li = list
  • dl = definition list = 定義リスト
    • dt = definition term = 定義 期間/用語
    • dd = definition description = 定義 記述
  • table = 表組全体のエリア
    • tr = table row = 行
    • th = table header = 見出しセル
    • td = table description = 表 記述 = セル
    • tr、tdのなかにh、pは入れられない
  • address = 連絡先
  • div = 任意の範囲、グループ化
インライン要素 = 中身
  • a = ハイパーリンク
  • img = 画像
  • span = 任意の範囲
    • 沢山使用する場合はclassを使用
その他
  • summary = 概要、要約
  • hr = horizontal rule = 水平線/横棒
  • テキストの一部を協調
    • storng = 重要
    • em = 強調
    • b = 注目してほしい場所を太字に

雛型のコードサンプル

<!DOCTYPE html>
<html lang="ja">
<head>
<mata charset="UTF-8">
<title>ページタイトル</title>
</head>
<body>
</body>
</html>

htmlコメントアウト

  • ブラウザ上に表示されないメモ
  • ソースコードを整理するときに使用
<!-- コメント -->