2009/10/20
Q＆A形式で学ぶHTML,CSS講座 VOL 46
■------------------------------------------------------------------------
ホームページ作成 いまさらHTML,CSS講座【Q＆A形式で学ぶHTML,CSS講座】
■------------------------------------------------------------------------
■ VOL 46
--------------------------------------------------------------------------
ご購読ありがとう御座います。
--------------------------------------------------------------------------
当メールマガジンでは、ホームページ作成において、必要な知識や、HTML、CSSを
Q＆A形式で学ぶ事が出来ます。
■スタイルシート編
--------------------------------------------------------------------------
■ 文字色に関するスタイルシート
--------------------------------------------------------------------------
colorプロパティを用いることで、文字色 ( 前景色 ) を指定する事ができます。
参考URL
http://homepagelecture.web.fc2.com/imasara_html/color_css.htm
--------------------------------------------------------------------------
それでは、以下の問いにチャレンジしてみて下さい。
--------------------------------------------------------------------------
<font color="blue">フォントカラー：青</font>
Q1
上記は「font要素」の「color属性」の値にカラーネームを指定し、文字を青色で
表示するように指定しています。
これを、テキスト（フォントカラー：青）に直接、スタイルシートで指定し、
同じような表示になるように変更して下さい。
Q2
Q1で作成したスタイルシートの指定の値(blue)をカラーネームといいます。
この値を「16進数で表すRGB値」に変更して下さい。
カラーコード表
http://homepagelecture.web.fc2.com/jwcolor.htm
Q3
Q1、Q2では、テキストに直接スタイルシートで色を指定していましたが、
これを、head要素に記述し、本文のテキストが青色になるように指定して下さい。
セレクタは「div要素」
プロパティの値は、「16進数で表すRGB値」で記述して下さい。
セレクタ・ルールセット
http://homepagelecture.web.fc2.com/imasara_html/css_selector.htm
--------------------------------------------------------------------------
以下、答えになります。
A1
<span style="color:blue;">フォントカラー：青</span>
A2
<span style="color:#0000ff;">フォントカラー：青</span>
A3
head要素
<!--
div{color: #0000ff;}
-->
</style>
body要素
<div>テキスト：青</div>
Q3ではセレクタをdiv要素と指定させて頂きましたが、実際には使いやすい要素や
class名などでも構いません。また、値もカラーネームでも大丈夫です。
今回は以上です。
次回は マージン についてQ＆Aを作成する予定です。
お疲れ様でした。
最後までお読み頂き、ありがとう御座います。
本講座は、「いまさらHTML,CSS講座」をベースに作成しています。
先に進みたい方は、以下URLをご参照下さい。
いまさらHTML,CSS講座
http://homepagelecture.web.fc2.com/
RSS
http://homepagelecture.web.fc2.com/index.xml
写真の掲載をメインとしたブログもやってます^ ^
EOS 40D と LUMIX DMC LX3
http://eos40ddmclx3.blogspot.com/
RSS
http://eos40ddmclx3.blogspot.com/rss.xml
Photograph of HCM Pro
http://hcm-pro.blogspot.com/
RSS
http://hcm-pro.blogspot.com/rss.xml
