[27] q要素で引用文を示そう

最終更新日:2017年11月04日  (初回投稿日:2011年10月06日)

今回は、<q>要素を使ってみましょう。
<q>要素は、他から引用された文章であることを示す要素です。

使用する要素 <q> 〜 </q>

「q」は、quotationの略。quotationは「引用文」という意味の名詞です。quoteともいいます。
クォーテーションマーク(quotation mark)「 ' ' 」とか「 " " 」とかは、引用文を表すもので「引用符」といいます。
(ちなみに「 ' ' 」は single quotation marks「 " " 」は double quotation marksといいます)

<q>を使ってみましょう

<q>要素は、ブラウザのデフォルトスタイルで 引用符( " " )が付きますので、自分でわざわざつけないこと。(2重になっちゃうからね)

また、「cite属性」を使って引用元の URL を書いておくこともできます。

サンプルを見てみましょう。

W3Cによると、 The use of q elements to mark up quotations is entirely optional; using explicit quotation punctuation without q elements is just as correct. ということで、
q要素の使用は完全に任意で、q要素を使わずに自分で引用符を付けても別にOKだそうです。

HTMLはこちら。

<p>
W3Cによると、 <q cite="https://www.w3.org/TR/html51/textlevel-semantics.html#the-q-element">The use of q elements to mark up quotations is entirely optional;using 
explicit quotation punctuation without q elements is just as correct.</q> ということで、<br />
q要素の使用は完全に任意で、q要素を使わずに自分で引用符を付けても別にOKだそうです。
</p>

まず、引用した文を <q> 〜 </q> で囲んでますね。
そして引用した文が存在するURLを cite属性で表記しています。

そして、サンプルの内容のとおり、W3Cは、q要素を使わずに自分で引用符をつけても構わない(just as correct)って言ってます。

よく引用文を掲載するウェブサイトなら、<q>要素のスタイルを CSS で決めておけば、自分でいちいち引用符を付けるより簡単便利ですね。

次回予告

次回は「引用」ついでに、引用したセクションを表す <blockquote>要素を。
これはテキスト用でなく、セクション(ブロック)のための要素ですが、せっかく<q>要素が 登場したので、続けて紹介します。

<q>要素は「テキスト(短いフレーズ)」用。
<blockquote>要素は「ブロック(ひと固まりの文章)」を引用するときに使います。

関連記事
この記事をはてなブックマークに追加

やる気を保つためにランキングに参加しています。
応援してくださると すっごいやる気を出します! (笑)

テーマ : webサイト作成
ジャンル : コンピュータ

tag : HTMLソース q要素

初心者にも使いやすい(と思う)レンタルサーバー

「レンタルサーバーはどこがいい?」とご質問をよくいただきますが、自分でも使っていてオススメなのは スターサーバー (ミニバードがスターサーバになりました)。管理画面がわかりやすくていい感じす。
仕事で使ってるロリポップ!もわかりやすい管理画面で、初めてでもすんなり使えます。
両方とも、なんといっても料金が安いです。

ちょっと料金は高いけど、高スペックでコスパが良く、信頼性も高いサーバといえば、やはりさくらのレンタルサーバと、エックスサーバー 。この2つは老舗でユーザーも多いので、質問する場がたくさんあり、初心者の方でもイケるだろうと思います。

スポンサーリンク

コメントの投稿

ご注意:メールアドレスは書かないで
「コメントを送信する」ボタンを押した後の「確認画面」で、メールアドレス・URL などを入力できるようになっており、メールアドレス・URL は、そのままオートリンクになる仕様です。
当方でメールアドレスだけ削除することも、メールアドレスを非公開にすることもできません
メールアドレスは書かないでください。詳しくはこちらにまとめましたのでご覧ください。

スポンサーリンク
最新記事
Category
オススメの本
Links
Calendar
06 | 2018/07 | 08
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
Archive
RSS Link
Profile

yuki★hata

Author : yuki★hata
せめて月1回の更新をめざします~。

メールフォームはこちら

スポンサーリンク
スポンサーリンク
Copyright © ほんっとにはじめてのHTML5とCSS3 All Rights Reserved.