htmlのciteタグとは? 使い方・斜体にならない場合の方法も解説!

この記事は上記のような疑問を解消するものとなっています。

cite要素は書籍、映画、楽曲、演劇、講演など、作品のタイトルを表現したいときに使用します。

頻繁に使われることがないので、HTMLを学び始めた初心者の方はcite要素を理解できていない人も多いかと思います。

そこでこの記事ではcite要素について解説していきます。

気になる方は是非最後まで読んで頂ければと思います。

1.cite要素とは?

cite要素とはcitationの略で引用元の作品名や題名などを表すものです。

読み方は「サイトヨウソ」です。

あくまで引用元のURLを表記するためのもので、引用自体には利用しません。

文章を引用をするときはblockquote要素やq要素を使用しますが、この要素内にcite属性を使うと、引用元のURLを表示することができます。

ブラウザでは、イタリック体(斜体)で表示されます。

HTML4では出典先を表すという要素で作品名だけではなく作者名や著者名などにも使うことができました。

しかし、HTML5では作品名だけを表す要素となり、範囲が狭くなったので注意して使いましょう。

2.cite要素の使い方

cite要素は、引用元のタイトル・著作者・製品名などを表す場合に使用します。

短い文の引用や転載はq要素を、長い引用はblockquote要素を使用します。

それではcite要素の使い方をみていきましょう。

<p>参考サイト：<cite><a href="https://html-css-dict.com/">HTML&CSS Dictionary</a></cite></p>

指定できる値はURI のみです。

引用元がWeb上に公開されたHTML文書であればそのURLがcite属性の値として使用できます。

ブラウザでは、イタリック体(斜体)で表示されます。

日本語のフォントではイタリック体を持たないもの(メイリオなど)も多く、その場合はイタリック体で表示されません。

「HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方」はHTML5/CSS3を使ってモダンなサイトを制作するためのコーディングテクニックをハンズオン形式で学ぶ本です。

実践的な内容になっているので次のステップに進みたいという方は是非利用してみてはいかがでしょうか!?

HTMLやCSSを利用してWebサイト制作の副業に挑戦してみたいという方はいませんか!?

そんな方に「はじめての副業コース」をオススメします。

なんとHTMLやCSSを学べるだけでなく、案件紹介も行ってくれます!

Webサイト制作で稼ぎたいという方は是非「はじめての副業コース」を受講してみてはいかがでしょうか!?