Style(css)の設定、サンプル
セレクタ
div
属性
font-family: 値
ＭＳ Ｐ明朝のように設定します。
div { font-family:ＭＳ Ｐ明朝
}
|
|
|
|
用語の、意味と内容
|
|
|
宣 言
|
| H3
|
{
font-size:
|
large; }
|
セレクタ
|
属性
|
値
|
|
プロパテイー
|
size:large;
|
|
|
サンプル
セレクタ・宣言（デグラレーションを指定
|
|
h3
{font-size:large;}
|
セレクタ（選択子）・宣言（デグラレーション）=プロパテイー（スタイルの種類）+値
すべての、纏まりを
パーツ
といいます。
セレクタ（選択子）について書籍によっては単純に(タグ)と表記している場合もあり多少混乱を招きやすい。
|
宣言（デグラレーション）に、属性・値を連続して指定することが出来、セミコロン
; で区切って設定します。
font-family:
ＭＳ Ｐ明朝
; font-size:11pt; color:#770000; font-weight: bold;
|
下記はセレクタに、複数のプロパテイーの
フォントの値、文字種・サイズ・文字色・文字の強調を設定したものです。
div
{
font-family:
ＭＳ Ｐ明朝
; font-size:11pt; color:#770000;font-weight: bold;
}
|
|
|
パーツ
について
上記のように、それぞれ記述したセレクタをHTMLの
複数ページで、スタイルを適用するように、
ファイルとして、保存するが複数のデグラレーションを纏めたものをパーツ
といいスタイルシートの、パーツを組み合わせてHTMLでページを作成していく。
|
|
|
（注）
用語について、一般的に宣言（デグラレーション）をスタイル セレクタをタグ パーツをスタイルシートと書籍によって記述をしているが同等の解釈になる。
|
|
|
スタイルの機能的な学習法
前回までに学習したように、スタイルで設定したパーツの組み合わせをページに反映していく。
分かり易く言えば、積み木細工のようにパーツとパーツを組み立ててページを完成していくようにする。
この概念を理解していないと、スタイルの学習ははかどらない。
|