2017/08/26
HTML勉強4日目となりました。
本日勉強したのは、以下の3つです。
sponsored link
引用 blockquote
そのブロック全体をまとめて引用する、というときに使います。
エディタに記述すると以下のようになります。
<!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>MyPage</title> </head> <body> <blockquote> <p> 芸術は爆発だ。 </p> </blockquote> <p> ゲーテは言った。前進をしていない人は後退しているのだ。 </p> </body> </html>
blockquoteタグで「芸術は爆発だ」という文章ごと引用している事を示しています。
これをブラウザに表示すると以下のようになります。
blockquoteで囲った部分だけ、他の文章に比べてインデントされています。
これで、「芸術は爆発だ。」という文章だけ、何か別の意味を持ったものである、という事を示すことができます。
一部引用 q
文章の一部だけ、引用している文書であることを示したいときに使います。
エディタに表示すると以下のようになります。
<!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>MyPage</title> </head> <body> <blockquote> <p> 芸術は爆発だ。 </p> </blockquote> <p> ゲーテは言った。<q>前進をしていない人は後退しているのだ。</q> </p> </body> </html>
「前進をしていない人は後退しているのだ。」という名言のみ引用であることを示すため、qタグで囲いました。
これをブラウザに表示すると以下のようになります。
qタグで囲ったところがブラウザでは「」で囲われました。
これで、この文書が引用である、という事を示すことができます。
なお、エディタの<html lang=”ja”> というコードを<html>に変更してみます。
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>MyPage</title> </head> <body> <blockquote> <p> 芸術は爆発だ。 </p> </blockquote> <p> ゲーテは言った。<q>前進をしていない人は後退しているのだ。</q> </p> </body> </html>
これをブラウザに表示すると以下のようになります。
先ほど、「」だったところが ” ” に変わりました。
こちらの方が引用っぽいですね!
引用元表記 cite=”URL”
先ほどの文章の引用元を表現する際に、cite属性を使います。
エディタに表示すると以下のようになります。
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>MyPage</title> </head> <body> <blockquote cite="http://www.kashikorogu.com"> <p> 芸術は爆発だ。 </p> </blockquote> <p> ゲーテは言った。<q cite="http://www.kashikorogu.com">前進をしていない人は後退しているのだ。</q> </p> </body> </html>
blockquoteタグ、qタグにそれぞれ 引用元を表記しました。
これをブラウザに表示すると以下のようになります。
見た目は何も変わっていません。
ただ、構造上は引用元が表記された状態になっています。
必要でああれば、これを見ている人がこの情報を辿る事が出来ます。