カテゴリー
cite HTML5

citeタグとは?-HTML

(例)citeタグの使用方法

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タグとは?-HTML

 citeタグは、作品(映画や書物、歌など)のタイトルを表記する際に使用するタグです。
 citeタグはあくまでタイトルを表すタグであり、著者を表すタグではありません。

 また、作品を引用・転載する場合はblockquoteタグ又はqタグの使用が適切です。blockquoteタグとqタグにはcite属性があり、引用元のURLを指定することが可能です。

カテゴリー
HTML5 s

sタグとは?-HTML

(例)sタグの使用方法

See the Pen
s
by linlin (@linlin098765)
on CodePen.

<p><s>1本100円</s></p>
<p>1本10円</p>

sタグとは?-HTML

 sタグは、古い(正確でなくなった)情報を表記する際に使用するタグです。
 例えば、商品の価格が更新された場合や、定義が変わった場合などに用います。

カテゴリー
HTML5 small

smallタグとは?-HTML

(例)smallタグの使用方法

See the Pen
small
by linlin (@linlin098765)
on CodePen.

<p><small>&copy; 2020 llc-Linlin.</small></p>

smallタグとは?-HTML

 smallタグは、免責・警告・法的規制・著作権・ライセンス要件等を表記する場合に使用されます。
 smallタグは、その箇所の重要性が低いという意味では使用されません。
 smallタグは、短い文章で使用することが基本であり、長い文章には適しません。

カテゴリー
HTML5 strong

strongタグとは?-HTML

(例)strongタグの使用方法

See the Pen
strong
by linlin (@linlin098765)
on CodePen.

<p><strong>猫</strong>はkawaii</p>

strongタグとは?-HTML

 strongタグは、文章中で重要または強調したい箇所に使用します。
 strongタグの使用箇所は太文字で表記され、重要性が高いことを表現しています。

カテゴリー
em HTML5

emタグとは?-HTML

(例)emタグの使用方法

See the Pen
em
by linlin (@linlin098765)
on CodePen.

<p><em>猫</em>はkawaii</p>

emタグとは?-HTML

 emタグとは、アクセント(強勢)をつける際に使用するタグです。
 文章中にemタグを使用することで、その箇所にアクセントをつけます。emタグはstrongタグで違い、重要性を訴えるタグではありません。

カテゴリー
a HTML5

aタグとは?-HTML

(例)aタグの使用方法

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タグとは?-HTML

 aタグはリンクを指定する際に使用するタグになります。
 aタグによって囲われた文章・図などをクリックすると「href属性」で指定した「URL」または「CLASS」や「ID」に遷移します。
 href属性にURLを指定する際は「相対パス」「絶対パス」の両方が指定可能です。

aタグのtarget属性とは?-HTML

 aタグのtarget属性とは、aタグで指定したhref属性を「どのように開く」かを指定できる属性です。

target属性説明
_self今のタブでリンク先を開く
_parent今のタブの親タブでリンク先を開く
_top今のタブの最上位タブでリンク先を開く
_blank新しいタブでリンク先を開く
任意の名称任意の名称で付けたタブを開く
カテゴリー
div HTML5

divタグとは?-HTML

(例)divタグの使用方法

See the Pen
div
by linlin (@linlin098765)
on CodePen.

<div>テキスト</div>

divタグとは?-HTML

 divタグそのものに意味はありませんが、1つの枠・かたまりとして扱う場合に使用します。つまり、divタグで囲われた範囲は1つのグループとして扱えます。
 divタグに意味はありませんが、用途は多様です。divはほとんどの状況で使用することが可能であり、例えばpタグをdivタグで囲ってポジションを調整したり装飾を施したりします。
 divタグが1つのグループだと言いましたが、HTML5ではsectionタグやaritcleタグ等の区分けするタグが存在するため無闇に使用しないことが求められます。

カテゴリー
figcaption HTML5

figcaptionタグとは?-HTML

(例)figcaptionタグの使用方法

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タグとは?-HTML

 figcaptionタグは図や表の題目(キャプション)を表記する際に使用します。
 図や表の表記についてはfigureタグによって表記します。

カテゴリー
figure HTML5

figureタグとは?-HTML

(例)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タグとは?-HTML

 figureタグは、図や表であることを表すタグになります。
 文章内で図や表を用いて紹介したい場合にfigureタグを使用することで関連していることを示すことができます。
 図や表に題目(キャプション)を付けたい場合は、figcaptionタグを使用することで表記できます。

カテゴリー
dd HTML5

ddタグとは?-HTML

(例)ddタグの使用方法

See the Pen
dl
by linlin (@linlin098765)
on CodePen.

<dl>
<dt><dfn>色</dfn></dt>
<dt><dfn>color</dfn></dt>
<dd>可視光線の波長の長短による視覚映像</dd>
</dl>

ddタグとは?-HTML

 ddタグとは、定義や用語の説明をする際に用いるタグです。
 ddタグはdlタグ・dtタグとセットで使用します。dlタグ内のdtタグによって定義や用語を表記し、ddタグによって説明します。
 ddタグは用語や定義のリストを表記したい場合などに使用します。