-html-はじめに覚えるタグ７個

h1 〜 h6タグ【見出し】

見出しを表すタグです。h1〜h6まで指定することができます。

単純に大きさが変わるとともに、SEOの判断基準になるとも言われています。

See the Pen by seison waten (@capplus1-design) on CodePen.

pタグ【段落】

段落を指定するために利用されるブロック要素です。

<p></p>で1行分改行されます。

See the Pen by seison waten (@capplus1-design) on CodePen.

brタグ【改行】

See the Pen by seison waten (@capplus1-design) on CodePen.

ブレイク（Break）を意味しており、改行を行うための要素です。終了タグを必要とせず、単独で使用します。

imgタグ【画像】

Webサイト上に画像を表示させるためのタグです。

URLやファイルの階層（パス）を指定することで画像が表示されます。<img>タグには閉じタグが必要ありません。

See the Pen by seison waten (@capplus1-design) on CodePen.

今回はこちらのサイトでダミー画像を生成しています→https://placehold.jp/

ファイル階層（パス）の指定

絶対パス

http://〜から始まるURLは絶対パスと呼ばれます。

<img src="http://〜">

こちらは馴染みがありますね！

相対パス

相対パスとは、アクセス中のページを基準とした相対的な記述方法です。

<img src="画像"> <!--同じ階層-->
<img src="フォルダ/画像">　<!--下の階層-->
<img src="../画像"> <!--上の階層-->

ulタグとliタグ【箇条書き】

箇条書きを行うタグです。

<ul></ul>で<li></li>を囲みます。

See the Pen by seison waten (@capplus1-design) on CodePen.

<ul>を<ol>に変えると番号付きのリストになります。

aタグ【アンカー（リンク）】

アンカー（Anchor）を意味するタグで、<a></a>で囲んだところがリンクになります。

href=”ここにパスを指定”　することでそのページにリンクします。

See the Pen by seison waten (@capplus1-design) on CodePen.

divタグ【範囲指定】

特に意味を持たないタグで、範囲を指定するためのブロック要素です。

グループ化を行うことで指定した範囲の背景や文字色の変更など、グループ単位でスタイル（CSS）を指定することが可能となります。

See the Pen by seison waten (@capplus1-design) on CodePen.