見る人に優しいウエブ作成


Directory

はじめに
CSSの利点
CSSの書式
CSSの定義
CSSの単位
継承について
CSSのプロパティ
CSS実例編 (1)
CSS実例編 (2)
CSS実例編 (3)
CSS実例編 (4)
CSS実例編 (5)


Contents

優しいウエブ作成
HTML入門
画像処理入門
ページレイアウト入門
スタイルシート入門
用語集
サポートタグ

+++ スタイルシート入門(基礎編)+++

戻る
次へ

■ 継承について

基礎編の最後に継承について説明します。無理に覚えなくてもCSSを使えますが、CSS指定の軽量と合理化が可能となります。

BODY{color:#000000;font-size:12px;}
H1{color:#000000;font-size:14px;}
BLOCKQUOTE{color:#000000;font-size:12px;line-height:140%;}

上記は、各要素それぞれにスタイルシートを指定していますが、実は継承と言う仕組みを理解するともっと簡単な記述で済みます。 上記の例を継承に従って記述すると下記の様になります。(見比べてみて下さい)

BODY{color:#000000;font-size:12px;}
H1{font-size:14px;}
BLOCKQUOTE{line-height:140%;}

となります。BODYで文字の色を指定しており、H1、BLOCKQUOTEもその色を受け継ぎ表示する。 文字の大きさは、H1以外BODYで設定した12pxに従うといったケースですので 各要素で必要なプロパティのみ宣言するだけで良いと言う事です。 しかし、面倒なのは全てのプロパティが全て継承されるわけではなく、 各プロパティの仕様や子要素から親要素へは継承されないなどもあります。詳しくは、教本等を読まれる事をお勧めします。



■ カスケーディング

カスケーディングとは、指定が衝突した場合の混乱の解消方法の事となっています。 CSSでの仕様では、ブラウザユーザ設定(Windows IEのみ)HTML作成者の順番で優先順位が高い事になっています。 この通りであれば、作成者側の設定通り表示され問題ないのですが、実際には、OSやブラウザで差があるようで、 必ずしもこの通りではない場合があります。 例として、BODY{font-size:12pt;}と設定した場合

テーブル内の文字が反映されない場合がある
フォントサイズを固定しているが、ユーザ設定が優先になる場合がある

などです。サポートされているプロパティの違いだけではなく、このブラウザ、OS依存がかなり複雑です。 できるだけ、多くの環境でチェックするしか方法はないようです。




Prev | Home | Next




Copyright(C) 1999-2000, ken_yuu All Right Reserved.