|
|
|
|
■長さ
長さには数値と単位を設定することで様々な指定が出来ます。単位には、「相対長指定」・「絶対長指定」の2種類があります。長さの単位は以下のようになります。
| 設定値 | 説明 |
|---|
| mm | ミリメートル(絶対長単位) |
| cm | センチメートル(絶対長単位) |
| in | インチ(1in = 約25mm)(絶対長単位) |
| pt | ポイント(絶対長単位) |
| pc | パイカ(1pc = 12pt)(絶対長単位) |
| em | 英字の「M」の高さを基準とした大きさ(相対長単位) |
| ex | 英字の「x」の高さを基準とした大きさ(相対長単位) |
| px | ピクセル
画面のピクセルとなります。(相対長単位) |
| % | パーセント
画面サイズや親要素に対する割合となります。(相対長単位) |
|
|
■パーセント
|
長さや大きさ等に対して表す相対的な値となります。様々なプロパティに対して使用されているため作用する結果は個々に異なります。親要素に用いられた場合に元の値がない場合は、初期値に対しての相対値をとります。
|
■URL + URN = URI
URL(Uniform Resource Locator)とは、Web上でのリソースのありかを示す1つの方式となります。またリソースを識別するための新しい拡張方式にURN(Uniform Resource Name)があります。両者を合わせてURI(Uniform Resource Identifier)と呼びます。
URI値の形式では、「url()」という関数の括弧内にURIをを記述します。括弧内のURIは「'」 or 「"」で括ってもよく、URIの前後(括弧のすぐ内側)には自由に空白類文字を挿入出来ます。またURIの中に括弧、コンマ、空白類文字、一重引用符、二重引用符がある場合は、「\」でエスケープする必要があります。以下の例では全て正しい動作となります。
BODY {background:url("http://www.bg.com/pinkish.gif")}
BODY {background:url('http://www.bg.com/pinkish.gif')}
BODY {background:url(http://www.bg.com/pinkish.gif)}
|
|
スタイルシートで相対URIを使用した場合は、スタイルシートでURIを指定している文書からの相対パスとなります。気をつけてください。
|
■カウンタ
■色
色は、キーワード or RGB数値で指定します。
| 設定値 | 説明 |
|---|
| #RRGGBB | 6桁指定(256段階で指定します)
例･･･#FFFFFF, #888888 |
| #RGB | 3桁指定(16段階で指定します)
例･･･#FFF, #888 |
| rgb(■%,■%,■%) | ％指定■(0〜100)
例･･･rgb(100%,100%,100%), rgb(50%,50%,50%) |
| rgb(▲,▲,▲) | 数値指定▲(0〜255)
例･･･rgb(255,255,255), rgb(136,136,136) |
| 文字指定 | HTMLから指定されている16色とブラウザで許容されている色等があります。
例･･･red, blue, black |
| システムカラー | 固定色ではなくページを閲覧するシステムに合わせたカラーとなります。
例･･･Background, Window, WindowText |
|
|
■基本色
HTML 4.01 仕様書に、以下の色がRGB色で指定されています。RGB色による指定も可能ですし、文字による指定も可能です。
| 基本色 |
|---|
| 色 | 色名 | RGB指定 |
色 | 色名 | RGB指定 |
|---|
| | Black | #000000 | | Silver | #C0C0C0 |
| | Gray | #808080 | | White | #FFFFFF |
| | Maroon | #800000 | | Red | #FF0000 |
| | Purple | #800080 | | Fuchsia | #FF00FF |
| | Green | #008000 | | Lime | #00FF00 |
| | Olive | #808000 | | Yellow | #FFFF00 |
| | Navy | #000080 | | Blue | #0000FF |
| | Teal | #008080 | | Aqua | #00FFFF |
|
|
■基本色以外
以下の色名によるものは各ブラウザが独自に対応している色です。また、ブラウザによっては、解釈できないものもあります。なるべくRGB指定にしたほうが良いでしょう。
以下のものは色名した色とRGB指定したものの対応表です。
| 色 | 色名 | RGB指定 | 色 | 色名 | RGB指定 | 色 | 色名 | RGB指定 |
|---|
| | aliceblue | #F0F8FF | | antiquewhite | #FAEBD7 | | aqua | #00FFFF |
| | aquamarine | #7FFFD4 | | azure | #F0FFFF | | beige | #F5F5DC |
| | bisque | #FFE4C4 | | black | #000000 | | blanchedalmond | #FFEBCD |
| | blue | #0000FF | | blueviolet | #8A2BE2 | | brass | #B5A642 |
| | brown | #A52A2A | | burlywood | #DEB887 | | cadetblue | #5F9EA0 |
| | chartreuse | #7FFF00 | | chocolate | #D2691E | | coolcopper | #BFBFBF |
| | copper | #BF00DF | | coral | #FF7F50 | | cornflower | #BFDFEF |
| | cornflowerblue | #6090EF | | cornflowerblue | #6495ED | | cornsilk | #FFF8DC |
| | crimson | #DC143C | | cyan | #00FFFF | | darkblue | #00008B |
| | darkbrown | #DA0B00 | | darkcyan | #008B8B | | darkgoldenrod | #B8860B |
| | darkgray | #A9A9A9 | | darkgreen | #006400 | | darkkhaki | #BDB76B |
| | darkmagenta | #8B008B | | darkolivegreen | #556B2F | | darkorange | #FF8C00 |
| | darkorchid | #9932CC | | darkred | #8B0000 | | darksalmon | #E9967A |
| | darkseagreen | #8FBC8B | | darkseagreen | #8FBC8F | | darkslateblue | #483D8B |
| | darkslategray | #2F4F4F | | darkturquoise | #00CED1 | | darkviolet | #9400D3 |
| | deeppink | #FF1493 | | deepskyblue | #00BFFF | | dimgray | #696969 |
| | dodgerblue | #1E90FF | | feldsper | #FED0E0 | | firebrick | #B22222 |
| | floralwhite | #FFFAF0 | | forestgreen | #228B22 | | fuchsia | #FF00FF |
| | gainsboro | #DCDCDC | | ghostwhite | #F8F8FF | | gold | #FFD700 |
| | goldenrod | #DAA520 | | gray | #808080 | | green | #008000 |
| | greenyellow | #ADFF2F | | honeydew | #F0FFF0 | | hotpink | #FF69B4 |
| | indianred | #CD5C5C | | indigo | #4B0082 | | ivory | #FFFFF0 |
| | khaki | #F0E68C | | lavender | #E6E6FA | | lavenderblush | #FFF0F5 |
| | lawngreen | #7CFC00 | | lemonchiffon | #FFFACD | | lightblue | #ADD8E6 |
| | lightcoral | #F08080 | | lightcyan | #E0FFFF | | lightgoldenrodyellow | #FAFAD2 |
| | lightgreen | #90EE90 | | lightgrey | #D3D3D3 | | lightpink | #FFB6C1 |
| | lightsalmon | #FFA07A | | lightseagreen | #20B2AA | | lightskyblue | #87CEFA |
| | lightslategray | #778899 | | lightsteelblue | #B0C4DE | | lightyellow | #FFFFE0 |
| | lime | #00FF00 | | limegreen | #32CD32 | | linen | #FAF0E6 |
| | magenta | #FF00FF | | maroon | #800000 | | mediumaquamarine | #66CDAA |
| | mediumblue | #0000CD | | mediumorchid | #BA55D3 | | mediumpurple | #9370DB |
| | mediumsateblue | #0E00B0 | | mediumseagreen | #3CB371 | | mediumslateblue | #7B68EE |
| | mediumspringgreen | #00FA9A | | mediumturquoise | #48D1CC | | mediumvioletred | #C71585 |
| | midnightblue | #191970 | | mintcream | #F5FFFA | | mistyrose | #FFE4E1 |
| | moccasin | #FFE4B5 | | navajowhite | #FFDEAD | | navy | #000080 |
| | oldlace | #FBF5E6 | | oldlace | #FDF5E6 | | olive | #808000 |
| | olivedrab | #6B8E23 | | orange | #FFA500 | | orangered | #FF4500 |
| | orchid | #DA70D6 | | palegoldenrod | #EEE8AA | | palegreen | #98FB98 |
| | paleturquoise | #AFEEEE | | palevioletred | #DB7093 | | papayawhip | #FFEFD5 |
| | peachpuff | #FFDAB9 | | peru | #CD853F | | pink | #FFC0CB |
| | plum | #DDA0DD | | powderblue | #B0E0E6 | | purple | #800080 |
| | red | #FF0000 | | richblue | #0CB0E0 | | rosybrown | #BC8F8F |
| | royalblue | #4169E1 | | saddlebrown | #8B4513 | | salmon | #FA8072 |
| | sandybrown | #F4A460 | | seagreen | #2E8B57 | | seashell | #FFF5EE |
| | sienna | #A0522D | | silver | #C0C0C0 | | skyblue | #87CEEB |
| | slateblue | #6A5ACD | | slategray | #708090 | | snow | #FFFAFA |
| | springgreen | #00FF7F | | steelblue | #4682B4 | | tan | #D2B48C |
| | teal | #008080 | | thistle | #D8BFD8 | | tomato | #FF6347 |
| | turquoise | #40E0D0 | | violet | #EE82EE | | wheat | #F5DEB3 |
| | white | #FFFFFF | | whitesmoke | #F5F5F5 | | yellow | #FFFF00 |
| | yellowgreen | #9ACD32 | | | | | | |
|
|
■システムカラー
CSS2により、システムが使用するシステムカラーを使うことが可能となりました。当然システムが現在使用している色となりますので、各々の人の環境に左右された色となります。以下に示します。
| 色 | 色名 | 説明 |
|---|
| | activeborder | アクティブなウィンドウの枠色 |
| | activecaption | アクティブなウィンドウのタイトルバー色 |
| | appworkspace | アプリケーション内(MDI)のウィンドウの背景色 |
| | background | デスクトップの背景色 |
| | buttonface | 立体的なボタンの表面色 |
| | buttonhighlight | 選択されたボタンの面 |
| | buttonshadow | 立体的なボタンの影になってる面 |
| | buttontext | 立体的なボタンのテキスト色 |
| | captiontext | タイトルバーのテキスト色 |
| | graytext | 選択できないテキスト色 |
| | highlight | リストの選択部分の色 |
| | highlighttext | リストの選択部分の文字色 |
| | inactiveborder | 非アクティブウィンドウの枠色 |
| | inactivecaption | 非アクティブウィンドウのタイトルバー色 |
| | inactivecaptiontext | 非アクティブウィンドウのタイトルバーテキスト色 |
| | infobackground | ツールチップの背景色 |
| | infotext | ツールチップのテキスト色 |
| | menu | メニューの背景色 |
| | menutext | メニューのテキスト色 |
| | scrollbar | スクロールバーの色 |
| | threeddarkshadow | 立体的に表示される部分の暗い影色 |
| | threedface | 立体的に表示される部分の表面色 |
| | threedhighlight | 立体的に表示される部分の光の当たっている面色 |
| | threedlightshadow | 立体的に表示される部分の明るい影色 |
| | threedshadow | 立体的に表示される部分の影色 |
| | window | ウィンドウ色 |
| | windowfreme | ウィンドウのフレーム色 |
| | windowtext | ウィンドウのテキスト色 |
|
|
■角度
角度は音声関連のスタイルシートで使用されます。角度には、負の値を指定することが出来ます。角度の単位は以下のようになります。
| 設定値 | 説明 |
|---|
| deg | 度 |
| grad | グラディエント |
| rad | ラジアン |
|
角度には、負の値を指定することも可能です。例えば、-10degと350degは同じ角度を示します。
角度の例を示すとは90deg, 100grad, 1.570796326794897radと同じ角度を示します。
|
■時間
時間は、音声関連のスタイルシートで使用されます。時間には、負の値を指定する出来ません。時間の単位は以下のようになります。
|
■周波数
周波数は、音声関連のスタイルシートで使用されます。周波数には、負の値を指定する出来ません。周波数の単位は以下のようになります。
例を示すと200Hzは低音域、6kHzは高音域を表します。
|
■文字列
文字列は、「'」,「"」を用いて囲むことで示すことが出来ます。ただし、「"」で囲んだ文字列の中に「"」を使うことは出来ません。また「'」で囲んだ文字列の中に「'」を使うことは出来ません。そのような時には「\」でエスケープする必要があります。「"」については、「\"」or 「\22」とし、「'」については、「\'」or 「\27」で記述して下さい。
"this is a 'string'"
"this is a \"string\""
'this is a "string"'
'this is a \'string\''
|
|
文字列の中に改行を入れることは出来ません。そのような時は、エスケープ文字「\A」で記述して下さい。
"You can set the opacity as uniform or graded,\A
in a linear or radial fashion"
|
|
|
Copyright © 2000-2003 ACCESS R All rights reserved. Presented by Ruby
|
|
