CSS の実践

ここまでで、CSSの基本的なルールに付いての説明が終わりました。個々のpropertyと其のvalueに付いての説明に入る前に、CSSの基本的なルールをまとめておきます。

スタイルシートの基本構造

selector {property1:value1; property2:value2}

property:value を宣言と呼ぶ。HTMLの全ての要素は selector になり得る。

Selectors

セレクタの種類

擬似クラスも擬似要素も、HTMLでは対応するマークアップがされていないと云う点が「擬似的」と云う所以である。因みに、擬似要素をサポートしているブラウザは、MS I.E.5.5、Netscape6など。

セレクタのグループ化

複数のセレクタに共通のスタイルを宣言したい時には、セレクタをカンマで区切ってグループ化できる;

h1,h2,h3,h4,h5,h6,strong,dt,th { font-weight: bold }
div p, div table, div ul { margin: 1em 2em }

スタイルの継承

一般に親要素のスタイル宣言は子要素にまで及ぶ。子要素では、これと異なる部分だけ定義すれば良い。継承しないプロパティーも在るが、常識的に判断できる。例えば、 'background-color' や 'line-height' 、 'font-size' などは継承するが、 'margin-top' は明らかに継承しない。

スタイルシートの導入方法

Cascading

複数のスタイル・シート間で競合が起こったときは、user agentの読み込み順が後ろのスタイル・シートほど、優先順位が高くなる。一般に、LINKによる外部スタイル・シートが最も低く、当該要素のstyle属性によるインライン・スタイルが最も高い。

単独のファイルの中でも、下の行に書いたスタイル宣言の方が優先順位が高い。

Copyright © 2004 SUGAI, Manabu. All rights reserved.
2001-07-15 published, 2004-06-20 revised.
SEO [PR] [ Windows7 f ^T[o[ Cu`bg SEO