引用タグと物理タグ・区切り線

2025.07.26

引用タグについて

<blockquote> タグは、htmlで引用を表すために使用されます。他のソースからの長めの引用を示す際に使われ、引用部分はインデント(右におしやられる、字下げ)されて表示されることが一般的です。

<blockquote>
  ここに引用したいテキストを入れます。
</blockquote>

引用元を指定する

引用元を明らかにしたい場合<cite> タグを使って引用元を記載することができます。

<blockquote>
  「人生は一度きりです。」 
  <cite>ジョン・ドゥ</cite>
</blockquote>

ここでは、引用元として「ジョン・ドゥ」が示されています。

引用をリンクにする

引用元のURLをリンクとして指定する場合もあります。その際は、<cite> タグ内でリンクを使います。

<blockquote>
  「インターネットは情報革命を起こした。」 
  <cite><a href="https://○×○×...">スティーブ・ジョブズ</a></cite>
</blockquote>

下付き・上付き文字

HTMLで上付き文字や下付き文字を指定するには、それぞれ<sup>タグと<sub>タグを使います。

  • 上付き文字 (<sup>): 通常のテキストよりも上に配置される文字を表示します。主に数式や化学式で指数や添え字を表現するときに使用されます。
  • 下付き文字 (<sub>): 通常のテキストよりも下に配置される文字を表示します。化学式や数式などで使用されます。

例

<html>
<head>
  <title>上付き文字と下付き文字の例</title>
</head>
<body>
  <p>上付き文字の例: H<sub>2</sub>O</p>
  <p>下付き文字の例: E = mc<sup>2</sup></p>
</body>
</html>

このコードでは、H2Oの「2」は下付き文字として表示され、E = mc²の「2」は上付き文字として表示されます。

この方法で、化学式や数式の表現が可能になります。

水平線を引く

htmlで水平線を表示するために使われます。このタグはコンテンツの区切りを視覚的に示すもので、セクションや段落の区切りに使われることが多いです。

<hr />は自己閉じタグ（閉じタグが不要）で、特別な属性は必要なく、単にそのまま記述すれば水平線が挿入されます。

基本的な使い方

<html>
<head>
  <title>水平線の例</title>
</head>
<body>

  <p>ここは段落1です。</p>
  <hr />
  <p>ここは段落2です。</p>

</body>
</html>

このコードでは、2つの段落の間に水平線が挿入されます。

コメント