HTML Tag

１．<nav>

　ナビゲーションの情報であることを強調するタグである。サイトには、フッター部分にサイトマップや会社案内などの情報が記載される場合が多い。それを明示させるタグ。

<footer>
    <nav>
        <ul>
            <li><a href="#privacy">プライバシーポリシー</a></li>
            <li><a href="#terms">利用規約</a></li>
            <li><a href="#support">サポート</a></li>
        </ul>
    </nav>
</footer>

２．<a>

　リンクを扱うタグである。<a>タグの間に文字や画像を挿入することで、その文字や画像をクリックすることで、リンクに移動することができる。また、重要な属性がいくつか存在する。以下にその属性を示す。

<a href="#" title="こんにちは" target="_blank"> </a>
<a href="#" title="こんにちは" target="_blank">
  <img src="image/test.png" />
</a>
<!-- href:リンクのURL -->
<!-- title:文字にカーソルを合わせたときに表示される文字 -->
<!-- target:リンクの開き方(blankは新タブで表示) -->

３．<ul> <ol> <li>

　これらのタグは、箇条書きに用いるタグである。<ul>は順序無しのリスト、<ol>は順序有りのリストと呼ばれる。<ul>では黒丸、<ol>では番号で箇条書きになる。また、ブロックレベル要素なので、<ul>タグの中に<ul>タグを入れることもできる。<li>は、その中の一つ一つの要素を示す。

<ul>
  <li>1</li>
  <ul>
    <li>要素1-1</li>
    <li>要素1-2</li>
    <li>要素1-3</li>
  </ul>
  <li>2</li>
  <li>3</li>
</ul>

４．<header> <footer>

　これらのタグは、ページの最上部のヘッダー、最下部のフッターを扱うタグである。一般的によく見られるフッターやヘッダーは、上下左右に空間がないものが多い。そのようにするには、CSSでmarginを0にする必要がある。この時、タグ内の<div>や<ul>要素内のmarginに0以外のものが設定されている場合は、そのmarginが干渉し、空白が表示されるので、中身のmarginも0に設定しておく。