[ ホーム | 一覧 | 検索 | 最終更新 | ヘルプ ] [ 新規 ]

KAWANO's PukiWiki Plus! - Lecture/InfoDesignB2005/4th/color のバックアップ(No.2)

AND OR
  • バックアップ一覧
  • 差分 を表示
  • 現在との差分 を表示
  • 現在との差分 - Visual を表示
  • ソース を表示
  • Lecture/InfoDesignB2005/4th/color へ行く。
    • 1 (2005-10-14 (金) 09:48:39)
    • 2 (2007-02-24 (土) 07:05:44)
    • 3 (2007-02-24 (土) 07:10:26)

色を表現する

▲ ▼

色の表現

HTMLでは、文字や線の色などを指定できます。 指定するには、色の名前や色の値を使います。

▲ ▼

色の値

光の三原色である、赤(R)緑(G)青(B)の強さを値であらわします。 16進数(0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F)を使い、RGBそれぞれを00〜FFまでの256段階で設定することができます。
blackは#000000、redは#FF0000、whiteは#FFFFFFのように、「#」のあとにRGBの値を設定します。

  • 参考:とほほの色入門:色見本
    • http://www.tohoho-web.com/wwwcolor.htm
▲ ▼

色の名前

代表的な色(16色)には、名前がつけられています。 それぞれの色の名前(そして色の値)は次のとおりです。

色の名前色の値色の名前色の値色の名前色の値色の名前色の値
black#000000gray#808080silver#C0C0C0white#FFFFFF
red#FF0000yellow#FFFF00lime#00FF00aqua#00FFFF
blue#0000FFfuchsia#FF00FFmaroon#800000olive#808000
green#008000teal#008080naby#000080purple#800080
▲ ▼

HTMLで色の指定するときの注意

HTMLでは、色を指定する要素や属性があります。 しかし、HTMLは文書の構造を示すのが役割です。 HTMLで色を指定することは、 現在よく使われているバージョンであるHTML 4.01では推奨されていません。

HTML 4.01では、色の指定はCSS(スタイルシート)を使うことが推奨されています。 今回は、古典的な手法として、 HTMLでの色の指定を紹介します。

▲ ▼

全体の背景の色を指定する

ページ全体の背景色を設定するには、 body要素にbgcolor属性を指定します。

pre> <body bgcolor="色の値">

...

</body>

/pre>

背景色を指定するときには、 文字色も設定しておくとよいでしょう。 背景色が文字色と同系列の色になると、文字が見えなくなる可能性があります。

▲ ▼

全体の文字の色を指定する

ページ全体の文字色を設定するには、 body要素にtext属性を指定します。

pre> <body text="色の値">

...

</body>

/pre>

ページ全体の文字色を変更しますが、 リンク部分の色は変更されません。 全体の色のバランスを考えて、 必要であれば、リンクの色も変更しましょう。

pre>

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

html lang="ja">

head>

meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

title>「兵庫太郎の日記」</title>

/head> <body text="#0066CC" bgcolor="#FFFFFF"> ...

/pre>

▲ ▼

全体のリンクの色を指定する

ページ全体のリンクの文字色を設定するには、 body要素にlink属性、vlink属性、alink属性を指定します。

pre> <body link="色の値" vlink="色の値" alink="色の値">

...

</body>

/pre>

それぞれの属性には、次のような意味があります。 注意して設定する必要があります。

  • link: まだ見ていないリンク部分の文字色
  • vlink: すでに見たリンク部分の文字色
  • alink: マウスのボタンを押したときのリンク部分の文字色
▲ ▼

文字の色を指定する

ここで紹介する方法は、あまり薦められない方法です。注意してください。

文字の色を設定するには、 font要素とcolor属性を指定します。

pre> <font color="色の値">...</font>

/pre>

font要素は、文字のさまざまな属性を指定する要素です。 color属性を使うことで、指定した範囲の文字の色を設定することができます。

▲ ▼

表やセルの背景の色を指定する

表やセルに背景色を設定するには、 table、tr、th、td要素に、bgcolor属性を指定します。

pre> <table bgcolor="色の値">...</table> <tr bgcolor="色の値">...</tr> <th bgcolor="色の値">...</th> <td bgcolor="色の値">...</td>

/pre>

bgcolor属性を使って、背景色を指定します。 table要素の場合は表全体に、 tr要素の場合は行全体に、 thやtd要素の場合はそのセルに、それぞれ背景色が設定されます。


次へ進んでください。


[前へ] [目次へ] [次へ]

メニュー

  • トップ
  • 授業
  • PukiWiki Log
  • Install Log
  • 道具箱
  • セキュリティ情報
  • RSSアンテナ

大学関係リンク

  • Webメール
  • 健康システム学科
  • 情報メディアセンター
  • 兵庫大学

今日の5件
  • FrontPage(316)
  • Lecture/timetable_2011(4)
  • Install Log/CentOS6/mod_ssl(4)
  • PukiWiki/1.4/マニュアル/プラグイン/i(3)
  • Lecture/CompPracR2005/2nd(3)
最新の5件
2016-04-08
  • Lecture/timetable_2016
  • Lecture
  • FrontPage
2015-09-30
  • Lecture/timetable_2015
2015-04-04
  • MenuBar

total: 1814
today: 1
yesterday: 1
now: 11


リロード   差分   ホーム 一覧 検索 最終更新 バックアップ リンク元   ヘルプ   最終更新のRSS
http%3A%2F%2Fhs-www.hyogo-dai.ac.jp%2F~kawano%2F%3FLecture%25252FInfoDesignB2005%25252F4th%25252Fcolor
Founded by Minoru Kawano.
Powered by PukiWiki Plus! 1.4.7plus-u2-i18n. HTML convert time to 0.192 sec.
Valid XHTML 1.1