See the Pen
blockquote by linlin (@linlin098765)
on CodePen.
<p>夏目漱石の<cite>草枕</cite></p>
<blockquote cite="http://www.◯◯.html">
<p>山路を登りながら、こう考えた。<br>
智に働けば角が立つ。情に棹させば流さ・・・etc</p>
</blockquote>
<p>作品の紹介文</p> citeタグは、作品（映画や書物、歌など）のタイトルを表記する際に使用するタグです。
citeタグはあくまでタイトルを表すタグであり、著者を表すタグではありません。
また、作品を引用・転載する場合はblockquoteタグ又はqタグの使用が適切です。blockquoteタグとqタグにはcite属性があり、引用元のURLを指定することが可能です。
See the Pen
s by linlin (@linlin098765)
on CodePen.
<p><s>1本100円</s></p>
<p>1本10円</p> sタグは、古い（正確でなくなった）情報を表記する際に使用するタグです。
例えば、商品の価格が更新された場合や、定義が変わった場合などに用います。
See the Pen
small by linlin (@linlin098765)
on CodePen.
<p><small>© 2020 llc-Linlin.</small></p> smallタグは、免責・警告・法的規制・著作権・ライセンス要件等を表記する場合に使用されます。
smallタグは、その箇所の重要性が低いという意味では使用されません。
smallタグは、短い文章で使用することが基本であり、長い文章には適しません。
See the Pen
strong by linlin (@linlin098765)
on CodePen.
<p><strong>猫</strong>はkawaii</p> strongタグは、文章中で重要または強調したい箇所に使用します。
strongタグの使用箇所は太文字で表記され、重要性が高いことを表現しています。
See the Pen
em by linlin (@linlin098765)
on CodePen.
<p><em>猫</em>はkawaii</p> emタグとは、アクセント（強勢）をつける際に使用するタグです。
文章中にemタグを使用することで、その箇所にアクセントをつけます。emタグはstrongタグで違い、重要性を訴えるタグではありません。
See the Pen
a by linlin (@linlin098765)
on CodePen.
<a href="https://www.llc-linlin.com/" target="_self">合同会社Linlin</a><br>
<a href="https://www.llc-linlin.com/" target="_parent">合同会社Linlin</a><br>
<a href="https://www.llc-linlin.com/" target="_top">合同会社Linlin</a><br>
<a href="https://www.llc-linlin.com/" target="_blank">合同会社Linlin</a><br>
<a href="https://www.llc-linlin.com/" target="Linlin">合同会社Linlin</a> aタグはリンクを指定する際に使用するタグになります。
aタグによって囲われた文章・図などをクリックすると「href属性」で指定した「URL」または「CLASS」や「ID」に遷移します。
href属性にURLを指定する際は「相対パス」「絶対パス」の両方が指定可能です。
aタグのtarget属性とは、aタグで指定したhref属性を「どのように開く」かを指定できる属性です。
| target属性 | 説明 |
| _self | 今のタブでリンク先を開く |
| _parent | 今のタブの親タブでリンク先を開く |
| _top | 今のタブの最上位タブでリンク先を開く |
| _blank | 新しいタブでリンク先を開く |
| 任意の名称 | 任意の名称で付けたタブを開く |
See the Pen
div by linlin (@linlin098765)
on CodePen.
<div>テキスト</div> divタグそのものに意味はありませんが、１つの枠・かたまりとして扱う場合に使用します。つまり、divタグで囲われた範囲は１つのグループとして扱えます。
divタグに意味はありませんが、用途は多様です。divはほとんどの状況で使用することが可能であり、例えばpタグをdivタグで囲ってポジションを調整したり装飾を施したりします。
divタグが１つのグループだと言いましたが、HTML５ではsectionタグやaritcleタグ等の区分けするタグが存在するため無闇に使用しないことが求められます。
See the Pen
figure by linlin (@linlin098765)
on CodePen.
<figure>
<img src="https://www.llc-linlin.com/picture/SEO.jpg" alt="画像の説明文">
<figcaption>SEO効果</figcaption>
</figure> figcaptionタグは図や表の題目（キャプション）を表記する際に使用します。
図や表の表記についてはfigureタグによって表記します。
See the Pen
figure by linlin (@linlin098765)
on CodePen.
<figure>
<img src="https://www.llc-linlin.com/picture/SEO.jpg" alt="画像の説明文">
<figcaption>SEO効果</figcaption>
</figure> figureタグは、図や表であることを表すタグになります。
文章内で図や表を用いて紹介したい場合にfigureタグを使用することで関連していることを示すことができます。
図や表に題目（キャプション）を付けたい場合は、figcaptionタグを使用することで表記できます。
See the Pen
dl by linlin (@linlin098765)
on CodePen.
<dl>
<dt><dfn>色</dfn></dt>
<dt><dfn>color</dfn></dt>
<dd>可視光線の波長の長短による視覚映像</dd>
</dl> ddタグとは、定義や用語の説明をする際に用いるタグです。
ddタグはdlタグ・dtタグとセットで使用します。dlタグ内のdtタグによって定義や用語を表記し、ddタグによって説明します。
ddタグは用語や定義のリストを表記したい場合などに使用します。