q 要素 (HTMLタグ)

引用文(インライン)

2018年08月02日

HTMLのq要素の説明です。q要素は、引用された文章であることを定義するインラインレベルの要素です。


目次

  1. 要素の記述例
  2. 要素の説明
  3. 利用できる属性
  4. ブラウザデフォルトCSS設定

要素の記述例

q要素の記述例
<p><cite>湯川秀樹</cite>の言葉 - <q>アイデアの秘訣は執念である。</q></p>

 

閲覧中ブラウザーでの表示結果

 

要素の説明

  • q要素は、引用された文章であることを定義する要素です。
  • q要素は、引用文をインラインの要素として扱いたい場合に利用します。
  • 引用文をブロックレベルの要素として扱いたい場合は、blockquote要素を利用します。

 

利用できる属性

q要素で利用できる属性
属性名 属性の説明
cite 引用元コンテンツのURLを定義する属性です。

グローバル属性

HTMLのすべての要素はグローバル属性が利用できます。グローバル属性の一覧については「グローバル属性」を参照してください。

イベントハンドラ属性

q要素がサポートするイベントハンドラ属性については「イベントハンドラ属性」を参照してください。

ブラウザデフォルトCSS設定

Google Chromeの場合

q要素のブラウザデフォルトCSS
q {
  display: inline;
}
q::before {
  content: open-quote;
}
q::after {
  content: close-quote;
}

 

 

 

Programming Style