引用テキストのブロックを作成する - blockquote タグによる引用 - HTML

HTMLで引用のブロックを記述するタグを紹介します。

概要

HTMLで引用のブロックを表現するにはblockquoteタグを利用します。なお、blockquoteタグはブロック要素として表現されます。

書式

blockquoteの開始タグから終了タグの間に引用するテキストを記述します。

コード例

下記のHTMLファイルを作成します。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
  <p>下記は引用ブロックです。</p>
  <blockquote>
    香が非常に良いお茶です。味はほとんどないため、香りを楽しむお茶と割り切って飲むとよいと思います。
ファーストフラッシュを飲みなれている方は、この香りでお茶のおいしさを十分感じられると思いますのでお勧めです。
  </blockquote>
  <p>上記まで引用</p>
</body>
</html>

表示結果

上記のHTMLファイルをWebブラウザで表示します。下図の画面が表示されます。<blockquote>タグで囲まれた引用ブロックはインデントされて表示されていることが確認できます。

著者

とりっち

iPentecのメインデザイナー
Webページ、Webクリエイティブのデザインを担当。PhotoshopやIllustratorの作業もする。

目次

引用テキストのブロックを作成する - blockquote タグによる引用 - HTML

概要

書式

コード例

表示結果

関連するページ