目次を飛ばして本文へ パン屑リストへ

各プロパティの表の読み方

や、また会たアルね。短いセクション担当させていたたく事になたアルよ。

ここでは、CSSの各プロパティの表の読み方説明するアル。まず表の概要ある。

採り得る値とその構文
初期値 デフォルト値
適用 適用可能な要素
継承 継承するか否か
パーセンテージ パーセンテージがどの値を基本とするのか

こんな風にプロパティ一つにこの表が一つずつ付いて来るアルよ。省略して複数まとめて一つの表表す事もあるよろし。

値の記述形式

じゃ上から順に説明してくアル。まずは値についてアルね。値の書き方ついてあるね。例を見るアル。

[ <'border-width'> || <'border-style'> || <色> ]
[ <識別子> <整数値>? ]+ | none
[<ファミリ名> , ]* <ファミリ名>
[ <長さ> | thick | thin ]{1,4}

<(小なり)>(大なり)で囲てある値は、ちこち特殊な値ある。データ型(data types)呼ばれてるアル。心配ないアルね。必要なとこではきちんとそれぞれの値の説明にリンクしてある良し、参考にするヨロシ。< と > で囲てない値は、キーワードと言てそのまま書くヨロシ。'(一重引用符)"(二重引用符)で括ては駄目アルよ。

[](大括弧)|(一重縦棒)||(二重縦棒)、あとキーワードやデータ型、 ] の後に付いている、?(疑問符)*(アスタリスク)+(プラス){}(中括弧)の説明が必要あるネ。

まずは前半、[](大括弧)|(一重縦棒)||(二重縦棒)について説明するある。

  • 並列に書き並べた値、つまり半角スペースなどで区切て並ぺた値は、すべて指定通りの順序で出現しないといけないアル。
  • 複数の値を | で区切てある場合、そのうち1つだけが出現しないといけないアルね。ゼロ個でも2個でもダメある。
  • 複数の値を || で区切てある場合、そのうち少なくとも1つが任意の順序で出て来ないといけないネ。
  • [] はグループ化を示すアル。値の書き方複雑になりそな時に使うアルね。

値の並列は || よりも結合力が強く、||| よりも結合力が強いアル。たから以下の例は
a b | c || d e

以下と等価アルね。
[ a b ] | [ c || [ d e ]]

もっと詳しく言うと、値の組み合わせとしては、こんな感じアル。
a b
c d e
c
d e
d e c

次は、 ?(疑問符)*(アスタリスク)+(プラス){}(中括弧)の説明アルね。これらは修飾子(modifiers)呼ばれてるアル。

  • アスタリスク(*)は、直前のデータ型、キーワード、グループの0回以上の繰り返しアル。
  • プラス(+)は、直前のデータ型、キーワード、グループの1回以上の繰り返しアル。
  • 疑問符(?)は、直前のデータ型、キーワード、グループの0回もしくは1回の出現アル。
  • 中括弧で括た自然数の組{A, B}は、直前のデータ型、キーワード、グループの、A回以上B回以下の繰り返しアル。

それじゃ、さきと同じよに、実例で見て行くある。
[ <識別子> <整数値>? ]+ | none

この場合、<整数値> に疑問符(?)が、[ <識別子> <整数値>? ] 全体にプラス(+)が付いてるから、識別子にオプションで整数値付けたもの列挙するいうことアル。例えばこんな例が挙げられるネ。
<識別子> <識別子> <整数値> <識別子> <整数値>
<識別子> <識別子>
none
inherit

次、いてみよう。
[<ファミリ名> , ]* <ファミリ名>

この場合、[<ファミリ名> , ] 全体にアスタリスク(*)が掛てるから、ファミリ名を,で区切て並ぺたもの言うことアル。例としては、以下のようなものアルね。
<ファミリ名>
<ファミリ名> , <ファミリ名>
<ファミリ名> , <ファミリ名> , <ファミリ名> , <ファミリ名>

それじゃ、最後の例アル。
[ <長さ> | thick | thin ]{1,4}

この場合、[ <長さ> | thick | thin ] までが {1,4} の対象になてるので、この三者選択を1回から4回繰り返すアル。例はこうなるアル。
thin
thick thin
<長さ> thin thick <長さ>
thick thin thick thin

以上で、値の読み方の説明終わりアル。ちこちややこしのコト?  大体分かれば良いアル。毎回きちんと説明するあるよ。モウマンタイ、モウマンタイ。

初期値

そのプロパティに何も指定しなかた場合の値あるネ。祖先要素から値を継承する場合多いので、注意するアル。継承するかどうかは、各プロパティの表中「継承」の欄を参照するアル。

適用

そのプロパティが有効な要素の事ね。ここに書かれてる要素以外にそのプロパティを指定しても無意味いう事アル。

継承

祖先要素から値を受け継ぐか否かアル。相対的な値を採るならそれ計算してから計算後の値継承する、コレ普通アルが、'line-height'の値が数値の時継承のし方違うアル。注意するヨロシ。

パーセンテージ

プロパティにパーセンテージが与えられた時、それをどう解釈すべきかが書かれてるアル。

パーセンテージ使えない時は、この欄無いアル。

以上で終わりアルな。またもやみちかい付き合いあったアルね。次はどこで会うアルかな?


page top
最終更新日:2018年07月18日
Copyright © 2002-2018 ばあど All Rights Reserved.