ナヴィゲーションを読み飛ばす。

概要

CSSの概要

HTMLの経緯とCSSの役割

現今，多くのウェブページはHTML(HyperText Markup Language)などの言語に拠って記述され，公開されています。HTMLは元来，学術論文などの論理的な文書をウェブに公開するための，普遍的な情報共有を目的とした言語でした。すなわち，文書のプレゼンテーションより中身にこそ関心が持たれるべき言語でした。しかし日常生活の一部としてウェブを利用し始めた人々の間では，HTMLの制限は不満が募る元となり，ウェブの爆発的成長と共にHTMLは様々な方法で拡張されてゆきました。ウェブページのプレゼンテーションを向上させようという志は素晴らしいものではありましたが，そのための技術によってウェブページは，特定の人々，特定の時代状況でしか成りたたず，より複雑化し，限られた環境にしか適応しなくなり，相互運用性問題に悩まされることとなり，障碍を持つ人々にアクセス障壁をもたらすなど，利用しづらい状態に成ってしまいました。

CSS(Cascading Style Sheets)はこれら種々の問題を解決すると同時に，HTMLにおける制限されたプレゼンテーション機構に取って代る仕組として仕様化されました。HTML 4.01仕様書（邦訳） 2.4.1では，文書著述の一般原則として次のように述べています。

HTMLは，常に構造的マークづけを規定するところのSGMLをルーツに持っている。HTMLの性質上，プレゼンテーションに関する要素や属性は，次々と他の機構，とりわけスタイルシートに置き換えられていく。また，文書の構造をプレゼンテーションと切り離すことで広汎なプラットフォームや多様なメディアでの文書提供コストを低下でき，文書の改訂も容易になるということが，経験的に知られている。

謂わばCSSとは，構造化文書で明示された意味や構造などの概念を様式化し，具体表現としてユーザに提示する仕組です。

補足：プレゼンテーション(表現)とは? スタイルシートとは?

プレゼンテーション（presentation）とは，ユーザの五感によって認知できる形式で，文書の内容および構造をレンダリングすること。つまり，単なる "見た目" や "レイアウト" と云った表面的な具象に限られない，もっと博い意味での表現のことです。

スタイルシート（Style sheet）とは，文書の表現方法の指定に特化した構文の集合体のこと。構造化文書に適用されるスタイルシートには三通りの出処があります： その内容の著者が指定したもの，ユーザが指定したもの，UAに備わっているもの。

CSSの基本的特徴のひとつは，これらスタイルシートの競合をカスケード処理できる事にあります。すなわち，著者側から好みのスタイルシートを与えられる一方で，読者側も個人的・技術的な不都合を調節するためのスタイルシートを適用できます。

なおCSSは，スタイルシートを記述するための仕様であり，"スタイルシート" と "CSS" は同義ではありません。

〔補足終了〕

つまりCSSは，単なる見た目を変える手段ではなく，文書情報の認知を補助する表現技術であるべきです。

当然のごとくCSSは，単に見映え“だけ”をよくする手段でもありません。構造化文書で示された意味や構造などの概念を様式化し，あらゆる方法で表現し，ユーザに判りやすく認知して貰うための技術です。要するに，認知性に優れてさえいればよいのです。

帰結として見映え“も”よくなればそれに越したことはないでしょう。しかしまづは理解しやすさ・利用しやすさを第一に考えるべきです。見た目を変えたり，見映えを工夫するのは，情報の表現手段に過ぎません。肝腎なのは，著者の考えが明快に伝わるようにすることです。

参考：HTMLの開発経緯・理念・略歴・将来への展望

CSSの正式勧告水準について

現在CSS仕様は W3C:World Wide Web Consortium に拠って "1版" と "2版" が正式に勧告されています：

CSS1:Cascading Style Sheets, level 1 （1996年12月17日勧告）
CSS1は，単純なスタイル構造――構造化文書に対してフォント，色と背景，スペーシング，テキストの装飾，ボーダー，マージンやパディングという様なスタイルを与える事ができる――を定めた最初のCSS仕様です。1999年01月11日に改訂されています。
CSS2:Cascading Style Sheets, level 2 （1998年05月12日勧告）
CSS2は，メディアタイプ依存のスタイルシートに対応しており，グラフィカルなブラウザ，音声出力，点字出力，印刷出力，携帯情報端末など，多様な出力を想定したスタイル設定が可能です。また，内容の配置，表のレイアウト，国際化に関する特徴，カウンタと自動番号振り，そのほかユーザインタフェイスに関するプロパティにも対応し，より柔軟で保守性が高い仕様になっています。（cf. CSS1からの変更）

改訂版CSS2.1と次世代CSS3

また同W3Cは，CSS2の改訂版となる "2.1版" と，次世代仕様のモジュール化された "3版" を策定中です：

CSS2.1:Cascading Style Sheets, level 2 revision 1
CSS2の改訂版となる仕様です。この仕様ではCSS2.0で発見されたエラーの修正，不明瞭な部分の明確化，一般に受容れられた慣習と仕様が異る部分の修正，実装されなかったプロパティや値の除外，CSS3を見据えての仕様変更など，様々に改訂されます。
CSS3:Cascading Style Sheets, level 3
CSS2の次世代仕様です。CSS3はモジュール化（機能や役割ごとに仕様書が細分化）されており，複雑化してきたスタイルシートの各機能の関係を明確にし，部分的な実装を容易にし，更に新しい機能を導入し易くなるという，メリットが期待されています。（see リンク集）

CSS2.1の詳細は，セオリー・オブ・スタイルシート； 技術評論社 編/刊； ISBN4-7741-2783-3でとても精しく解説されております。

CSS2.1 vs CSS2

1998年にCSS2仕様が勧告されて以来，CSSコミュニティは有意義な経験を積みました。CSS2仕様に孕んでいた多様なエラーは正誤表（errata）の公表をとおして度々訂正されて来ましたが，その経験に基いて改訂される機会はまだありませんでした。

これら多くの問題はやがて到来するCSS3仕様によって対処されるでしょう。しかし現在状勢のままでは，CSS2仕様の実装および相互運用性において妨げになります。そこでCSS2.1仕様では，この状況からの改善事項を次のように挙げています：

CSS2のいくつかの部分はCSS2.1でも不変であり，いくつかの部分は改訂され，いくつかの部分は除外されました。しかし除外された部分は，将来のCSS3仕様において再使用されるかもしれません； CSS2.1以前とのかかわりは将来の各仕様で言及されます。

（補足：先進的なウェブブラウザの殆どはすでにCSS2.1準拠の方針にあるため，前方互換性には然程支障を来さないでしょう。）

CSSの設計原則

上位および下位互換性

CSS2適合のユーザエージェントは，CSS1スタイルシートも理解できることになっている。CSS1適合のユーザエージェントもCSS2のスタイルシートを読込めるし，理解できない部分は抛棄してよい。また，CSSに対応していないユーザエージェントでも，スタイル設定された文書を表示できる。もちろんCSSで可能になるスタイルの向上は得られないが，文書の内容はすべて表示される筈である。

構造化文書の補足的な役割

スタイルシートはマークアップ済みテキストにスタイル情報を提供し，構造化文書（たとえばHTMLおよびXML応用など）を補足する。スタイルシートの変更は，マークアップにほとんど影響を与えないで容易におこなわれるべきである。

特定のヴェンダ，プラットフォーム，およびデヴァイスからの独立

スタイルシートは構造化文書を特定のヴェンダ，プラットフォームおよびデヴァイスから独立した位置に保つことを可能にする。但しスタイルシート自身はと謂うと，ヴェンダおよびプラットフォームからは独立だが，デヴァイスからは独立していない。たとえば，CSS2ではプリンタのみを対象にしたスタイルシートを書くこともできる。

保守性

文書からスタイルシートを指し示すことにより，Web管理者のサイト保守が容易になり，サイト全体を通じて一貫した外観および雰囲気を保つことができる。たとえば，サイトを構成する全背景を変更しようと思えば，たった一つのファイルを変更するだけで済む。

簡潔性

CSS2はCSS1に比べると複雑ではあるが，やはり人間に読書き可能な簡潔なスタイル言語である。CSSプロパティは可能なかぎり相互に独立されており，ある効果を実現するための方法は一般に唯一つである。

ネットワークの能率

CSSでは，内容の表現に無駄のない符号化を提供している。ある出力効果を実現するのに用いられる多くの画像や音声ファイルと比較すると，スタイルシートはその内容量を格段に少くしてくれる。また，接続量がより少くなり，ネットワークの能率が向上する。

柔軟性

CSSは，幾つかの方法で内容へ適用できる。CSSの重要な特徴としてスタイル情報をカスケード処理できる機能がある； すなわち，ユーザエージェントのデフォルト指定，ユーザ独自の指定，リンクされたスタイルシートの指定，文書ヘッダに埋込まれた指定，そして文書本文に現れる要素に設定された属性での指定。これらの指定を優先順位に従って処理できるのである。

豐かさ

文書著者に出力効果の豐富な設定方法を提供することで，表現媒体としてのWebの豐かさが向上する。デザイナたちは，DTPやスライドショウのアプリケーションによく見られる機能を欲しがってきた。彼らが望む効果の幾つかはデヴァイスの独立性と相容れないが，CSS2ではそれらの要求を取り入れてゆく方向を採る。

他言語との連携

本仕様に記述されている一聯のCSSプロパティは，視覚表現と音声表現の両方について一貫した整形モデルを形成している。CSS言語を通してこれらのモデルにアクセスできる訣だが，他言語との連携も可能である。たとえばJavaScriptのプログラムは，ある要素の'color'プロパティを動的に変化させることができる。

アクセシビリティ

CSSには，何らかの不具合を持つユーザがWebに接しやすくなる特徴がある：

  • フォントの外観を制禦する各プロパティにより，アクセシビリティに缺ける画像化テキストを排除できる。
  • 配置を制禦する各プロパティの導入により，強引にレイアウトを整えるマークづけトリック（透明画像など）を排除できる。
  • !important規則の意義は，特定の表現要求を持つユーザが制作者のスタイルシートを上書きできることである。
  • 全プロパティの新しい 'inherit' 値により，カスケードの一般性が向上し，より容易で一貫性のあるスタイル調整ができる。
  • メディアグループの導入や，点字（braille），点字の型押し（embossed），tty（固定ピッチ出力）の新設など，様々なメディアへの対応を改善したことにより，ユーザおよび文書著者はページをそれらの特定デヴァイスに適応できる。
  • 音声の各プロパティに拠って，声（voice）や音（audio）を出力する制禦が与えられる。
  • 属性セレクタ，'attr()'函数，'content'プロパティなどにより，代替内容へのアクセスが与えられる。
  • カウンタおよび節/段落への番号振りにより，文書のナヴィゲート能力が向上する。また，インデント餘白の排除もできる（点字デヴァイスでは重要）。'word-spacing'や'text-indent'等のプロパティにより，文書内の餘計な空白類の必要性をなくす。

CSS2の処理モデル（The CSS2 processing model）

この節では，CSSをサポートするUser Agentがどのように働くのか，その一例を提示します。ここで述べる方法は仕様書で述べられている一つの概念モデルに過ぎず，現実の実装方法は多様であってよいとされます。このモデルでは，UAは以下の手順を踏んで処理を行います：

  1. ソース文書を解析して，それから文書ツリーを生成する。

  2. 対象となるメディアタイプを識別する。

  3. その文書にかかわるスタイルシートのうち，対象となるメディアタイプに適用されるものをすべて取得する。

  4. 対象メディアタイプに適用できるすべてのプロパティについて，ぞれぞれ一つの値をわりあてることに拠り，文書ツリーを構成するすべての要素を註解（annotate）する。プロパティに値をわりあてる際には，カスケード処理と継承で述べるメカニズムに従う。

    値を計算する際その一部については，出力対象となるメディアタイプごとに適した専用アルゴリズムに依存する場合もある。たとえば一般的なコンピュータの画面上（スクリーン媒体）に出力するのであれば，User Agentは視覚整形モデルを適用する。

  5. 註解（annotate）された文書ツリーから整形構造（formatting structure）を生成する。整形構造は文書ツリーと似通っている場合も多いが，大きく異る場合もある。特に，著者が疑似要素および生成内容を多用していると，両者間にはかなりの相違が生じる。

    この処理段階で注目すべきなのは，CSS適合User Agentにおいて文書ツリーは改変されない，という事である。特にスタイルシートで生成された内容について文書言語のプロセッサにフィードバックされることはない； たとえば文書を再解析する目的のために。

  6. 整形構造を対象メディアに転送する。具体的には結果を印刷する，画面に表示する，音声で表す，など。

カンヴァス（The canvas）

CSSのカンヴァス（canvas）とは，あらゆるメディアについて「文書の整形構造が出力される空間」のことです。カンヴァスは各次元について無限空間を持つとされますが，実際には対象のメディアに応じた有限領域を設定し，そこにカンヴァスをレンダリングさせます。

たとえば連続メディアの視覚系ブラウザなら，カンヴァスを表示域に出力します。その際には横幅に最小値が設けられ，表示域の寸法に基いた初期幅を設定するでしょう。そして縦方向に溢れた内容に関しては，スクロール操作により閲覧できる様にします。頁として印刷するUAなら，一般に横幅および縦幅に制約を設けるでしょう。また音声出力なら，音声空間は制限しても，時間的な制限は設けないかもしれません。

ウェブブラウザでスクロール機構が一切出現していないなら，おおむねカンヴァスと表示域は一致します。もしカンヴァスより表示域が小さいなら，スクロール機構を出現させるでしょう。もしそうなら，スクロール位置が起点のゼロにある状態の時にかぎり，表示域とカンヴァスの原点（座標0, 0）は互いに一致します。つまりユーザが表示域をスクロールさせる程，カンヴァスの原点からは遠ざかって行きます。（see 初期包含ブロック）

わりあてモデル（addressing model）

CSS2のセレクタおよびプロパティは，文書またはUAにおける以下の部分を参照できます：

そのほか背景画像もしくはボックスの固定配置では，表示域（viewport）を参照できます。

用語の定義

この節とあわせて，HTML覚書のほうの用語定義もご覧になるとより理解が深ります； 大分重複しています。

著者（Author）

著者（もしくは制作者）とは「書き手」のことで，文書やスタイルシートを書いたり，生成したりする人，あるいはプログラムのこと。オーサリングツール（authoring tool）はこの著者の特別な事例であり，文書やそのスタイルシートを生成するプログラムを指す。

ユーザ（User）

ユーザ（もしくは利用者）とは，UAと遣りとりする人のこと； 文書とそのスタイルシートを見る，聞く，その他の利用法で。

実装（implementation） ，実装者（implementors）
ユーザエイジェント（UA:User agent）

ユーザの代りに様々な仕事をこなして呉れるプログラムの総称。HTTPに基いて，リソースの送出を要求するもの。リソースの取得や解析，データの収集，リソースの保存などを行う。ものに依っては文書の内容と構造をレンダリングし，人間が閲覧できる様にする。

User Agentには以下のものがある： 視覚系ブラウザ（テキストだけのもの，グラフィカルなもの），非視覚系ブラウザ（音声や点字で表現するもの），検索エンジンのロボット（クローラ），携帯電話，PDA，ダウンロードツール，別の文書形式へ変換するもの，印刷出力を行うもの。そのほかスクリーンリーダー，画面拡大表示ソフトウェア，音声認識ソフトウェアなどのようにブラウザと共に動作する支援技術も含まれる。

ウェブブラウザ（WWW browser）

User Agentのひとつ。取得した文書やスタイルシートを解析し，文書の構造および内容をレンダリングし，ユーザが見たり，聞いたり，情報を認知できるように機能するプログラムのこと。しばしば単にブラウザと呼ばれる。これには非視覚系のものも含まれる。

スクリーンリーダー（Screen reader），音声出力ブラウザ（Voice browser）

スクリーンリーダーとは，画面上の表示内容を音声によって読上げるソフトウェアのこと。主に視覚に障碍のある人々に利用される。一般に画面上のテキスト情報が読上げられるが，しかしペイント画像のピクセルで表現されたテキスト情報は読上げできない。

音声出力ブラウザとは，ウェブページを合成音声で読上げたり，音声媒体に特化した閲覧環境を提供するプログラムのこと。文書構造の表現手段としては出力音の特性変化（声の種類・周波数・抑揚など），音源方向の変化，休止時間，合図の挿入，音声の説明などを用いる。GUI環境では，スクリーンリーダーやほかの視覚系ブラウザの機能と組合せて利用される事がある。（仕様：音声スタイルシート）

情報の音声出力は明らかなアクセス性の向上が得られる以外にも大きな需要がある： たとえば車内利用，工業や醫療現場での文書システム，家庭内娯楽などに需要が見られるほか，文章の読みを学習したいユーザ，もしくは通常の閲覧に何かしら不都合のあるユーザにとっても，音声出力はとても役に立つだろう。また，著者が "誤字脱字衍字" もしくは "スペリング" を校正するのにも役立つかもしれない。

音声読上げに関しての情報は，少しばかりだが音声出力 - 附録：ウェブデザイン関聯リンク集にまとめてある。

点字ディスプレイ（Braille display）

点字ディスプレイとは，電子デヴァイス（通常はコンピュータ）からの指示に従って，ピン状の突起物を機械的に上下させて凹凸を表現する装置の事で，時間に伴って変化する1行の点字が生成される。一般に，点字出力用のソフトウェアと組合せて使用される。

現在の点字ディスプレイには，1セル（6または8ドット）から80セルまであり，大部分は12〜20セル程度と云う。

動作する/しない

HTML文書やCSSスタイルシートというのは，直裁的な特定動作をコンピュータに指示しない。またプログラミングのごとく処理の流れもない。動作云々といふのはプログラミング言語で記された処理やアルゴリズムが処理系において不具合なく流れるかどうかを謂う。

もちろんHTMLはマークアップ言語であり，CSSは簡潔なスタイル言語であり，プログラミングはできない。

そもそもUAというのは，様々な過程を経て段階的に文書やスタイルシートを処理するのであり，“動作する/しない” という短絡的な説明で済まされる問題ではない； おおよそ取得，解析，エラー処理，割当て，レンダリングの過程がある。（see 処理モデル）。

たとえばCSS構文の解説で挙げると全角英字にすると動作しないと云うのを見かけるが，不適切である。 厳密に謂えば「いわゆる全角英字に関してはCSS文法の字句ではなく，これは不正なので，エラー処理を経てその規則や宣言は無視される」のである。

アクセシビリティ（accessibility）

アクセスしやすさ，接しやすさの度合のこと。障碍を持つユーザを含め，あらゆる人々が，どんなUAを利用していても，どのような環境のもとでも，認知しやすく，操作可能であるように設計されている情報は，アクセシビリティ（accessibility）が高いと表現される。

これは特定のハンディキャップに対してだけ有意になるような配慮ではなく，あらゆる人々が共通して情報にアクセスでき，認知でき，利用できるようにする，ユニヴァーサルな情報設計の事である。ただしハンディキャップが重度になる程，享受される恩恵も大きい。

アクセシビリティ・使いやすさに関しての情報は，アクセシビリティ・ユーザビリティ関聯（リンク集）にまとめてある。

プレゼンテーション：表現方法（presentation）

プレゼンテーション：表現方法（presentation）とは，ユーザの五感によって認知できる形式で，文書の内容および構造をレンダリングすること。つまり，単なる "見た目" や "レイアウト" といった表面的な具象に限られない，もっと博い意味での表現。

レイアウトと見映え，デザイン

見映えとは既にある外観の印象がよいこと。レイアウトとは文書の構成要素を空間に配列すること。

なにかのスタイルを施しても，即見映えには直結しない。見映えは読み手側の主観で判断されるものであり，著者側で能動的にはっきり指定しうる事象ではない。外観の工夫により見映えよく認識して貰えるやもしれないが，それは著者の技倆次第である。

CSS機能にはレイアウトにかかわる多くのプロパティが用意されているが，勿論それだけではない。また，デザイン（design）というのは設計や意匠そのほか非常に広義な概念を有している。視覚表現に関与しない文書設計なども広義にはデザインに含まれる。

スタイルシート（Style sheet）

スタイルシートとは，文書のプレゼンテーション（表現方法）の指定に特化した構文の集合体のこと。構造化文書に適用されるスタイルシートには三通りの出処がある： それはその内容の著者が指定したもの，ユーザが指定したもの，UAに備わっているもの。

CSSの基本的特徴のひとつは，これらスタイルシートの競合をカスケード処理できる事にある。すなわち，文書著者側から好みのスタイルシートを与える事ができる一方で，読者側も個人的・技術的な不都合を調節するためのスタイルシートを適用できる。

なお，CSSはスタイルシートを記述するための言語仕様であり，"スタイルシート" と "CSS" は同義ではない。つまりCSSというのは言語の名称であり，スタイルシートその物ではない。CSS仕様に基いたスタイル構文の集まりを便宜のためCSSスタイルシートと呼ぶ。

ソース文書（Source document）

ひとつ以上のスタイルシートが適用される文書のこと。ソース文書は，要素のツリーとして文書を表現する何らかの言語で符号化される。各要素は，その型を識別するための名称，任意か必須指定の多数の属性，そして空の場合もある内容から構成される。

文書言語（Document language）

ソース文書を記述するための符号化（マークアップ）言語のこと。たとえばHTMLやXML応用など。CSSスタイルシートというのは，文書言語のプレゼンテーションを記述するのに用いるものであるが，文書言語の基礎をなす意味論を変更するものではない。

ウェブ（WWW:World Wide Web）

世界規模に拡がった情報の網の目。1989年，CERN（欧洲素粒子物理学研究所）に所属していたTim Berners-Lee氏（現在はMIT CSAILの上級研究員，W3Cディレクタに就任）により提唱された，ネットワークを使用したハイパーテキストの情報共有システム。

ウェブは情報共有を実現するための普遍的な約束として，次の三機構から成り立っている：

これらの機構により，ウェブの情報資源が可能なかぎり多くの人々の間で入手できるのである。

HTML（HyperText Markup Language）

HTMLとは，SGMLに基いて定義された，ウェブに文書を公開するための簡潔なマークアップ言語。

HTMLでは定められた約束ごとに基いて，文書内に潛在している構成要素をタグの印づけ（マークアップ）に拠って明示する。この仕組からHTMLはマークアップ言語と呼ばれており，同時にリソース間を結びつけるリンク機構を備えたハイパーテキスト言語でもある。

HTMLは構造的なマークづけを規定するSGMLがそのルーツであり，その本来の性質上，プレゼンテーション（主に視覚的な体裁手段）に関する要素や属性は本質ではなく，スタイルシート（とりわけCSSの仕組に）置き換えられて行くことになる。文書の構造とプレゼンテーションを分離することにより，広汎なプラットフォームや多様なメディアでの文書提供コストを低減でき，更には文書の改訂も容易になるだろう。

最新のHTML仕様はHTML 4.01であり，W3Cに拠って勧告されている。また，ISO（国際標準化機構）とIEC（国際電気標準会議）との合同会議に拠って，HTML 4.01厳密型の更に厳格なサブセットであるISO/IEC 15445:2000も規格化されている。

XHTML（Extensible HyperText Markup Language）

XHTMLとは，HTMLをXML応用として再生産し，サブセット化し，拡張する，文書型とそのモジュールのファミリ。

XML 1.0応用として再定式化した最初のXHTML文書型として，2000年にXHTML 1.0が勧告（2002年08月01日に改訂）されており，その他の文書型にはモジュール化されたXHTML 1.1，そして小規模な情報機器に向けたXHTML Basicが勧告されている。

文書型定義（DTD:Document Type Definition）

文書型定義（DTD）とは，SGML応用の文書言語で定められている，マークづけ構成素の構文。

HTMLのSGML構成素には，たとえば要素型――構造あるいは望まれる振舞いを表現する構成要素の種類――があり，その特性や性質を示すために指定される属性がある。これらはDTD内の "要素型宣言" や "属性リスト宣言" で定められている。

各要素型宣言には内容モデルと呼ばれる――別の場所で定義された要素型名や実体名を用いて，その要素にどのような内容がどのような順序で何回出現しうるのかを示す――定義が含まれ，これにより要素の親子関係のルールが決められている。

（参考資料：HTMLのDTDを読んでみよう； DTD（文書型定義）の読み方； ごくごく簡単なDTDの説明）

文書著者が自身の文書において，どの文書型定義を用いるかは，次項の文書型宣言で示される。

文書型宣言（Document type declaration）

正しいHTML文書には，どのヴァージョンであるかの文書型宣言が必須であり，著者は自身の文書冒頭にそれを含めねばならない。HTML 4仕様では文書型宣言が明示されない文書の処理を明言していない。すなわちUAがどう解釈するかは不明である。

最近のウェブブラウザでは，文書型宣言の有無などの条件に基いて，解析と整形を切替えることがある。これには一般にふたつのモードがある： 過去の慣習的な解釈を再現するもの，標準仕様に則して厳格に解釈するもの。（cf. レンダリングモードの情報）

（参考資料：文書型を選択しよう； 文書型宣言の読み方； 文書型宣言について； 文書型宣言の意味）

つまり，文法や文書型宣言をなおざりにしていると，仕様通りに処理されず，新しい実装も有効に働かない。

タグ（tag）と要素（element）

タグ（tag）とは，ソース文書内に示されるマークづけ符号であり，構造化文書で構成されうる要素（element）――暗示的に存在する文書著者の意図や目的の構成単位； 見出しや段落，箇条書きなど――をUAが識別できるように明示するもの。

勿論，要素はタグではない。たとえば「Pタグ」と云った具合に，要素として説明すべき場合でもタグと云う人もいる。しかし要素は要素，タグはタグであり（開始タグにしても終了タグにしても），それぞれ別の概念である。このリファレンスではこれらを峻別する。

さらに，タグは命令ではない。HTMLは文書の具体的な表現方法をUAに強要しない。文書に潛在する要素を明らかにするための目印をつけるだけである。文書にプレゼンテーションが施されるのは，何かしらのスタイルシートが適用された結果に過ぎない。

マークアップ例を挙げると，p要素により段落を伝えるには <p>段落要素の内容…</p> とタグをつける：

このようなマークアップ行為は，文書言語で定められた約束ごと（文書型定義）に沿って行わねばならない。

一般にHTMLの要素はソース文書内のタグで明示されるものであるが，文脈上その存在や範囲が自明な場合に限り，開始タグや終了タグを省略できる場合もある（例：html，body，tbody，p，li）。たといそのような要素のタグづけを省いたとしても，適正なUser Agentは要素の存在を推量して，文書ツリーを正しく組上げる。ただしXML応用であるXHTML文書等では，タグの省略は許されない。（see 文書ツリー）

HTMLの要素型には例外として，内容が存在しない空（empty）の物もある（例：br，hr，img）。HTMLの空要素では，終了タグを絶対に持ち得ない。XML応用における空要素のマークづけでは，一般に“空要素タグ”を用いて <br /> のごとく明示する。

User Agentはソース文書内に記述されたタグづけを解析し，それから要素の階層構造として文書ツリーを生成する。CSSの殆どの規則は，表現形態を指定するのに要素型の名称（例：p，em，etc…）を使用し，文書ツリー内に存在する要素とマッチングを行う。

属性（Attribute）

要素の開始タグにしめす性質や特性であり，自身の名称とその値（属性名="値"）から構成される。

具体的にはたとえば <h1 id="attr">属性</h1> というマークづけでは，開始タグ内の id="attr" の部分が属性である。これは汎用属性であるid属性の値として "attr" を指定している。単一の開始タグには，空白区切りの多種類の属性が出現しうる。

CSS2以降ではスタイルの選択對象として，文書言語の属性およびその値とマッチングすることができる。

置換要素（Replaced element）

置換要素とは，その内容がCSSの整形モデルの範囲外にある要素（たとえば画像，埋込まれた文書またはアプレットなど）のこと。たとえばHTMLのimg要素の内容はsrc属性が指し示す画像によって置き換えられる。（他のHTML要素型ではobject，iframe，applet，inputなどが該当するだろう。）　置換要素はしばしば内在寸法を有している： 内在幅と内在高，そして内在比。たとえばビットマップ画像は，絶対単位（内在比はそれから明確に測定できる）によって内在幅と内在高を特定する。一方，他の文書などは内在寸法を有しないかもしれない（たとえばブランクのHTML文書）。

内在寸法（Intrinsic dimensions）

内在寸法とは，ある要素の幅および高さがその要素自身に拠って定められて，他者の状況に依存しない寸法のこと。CSS仕様では，内在寸法の取得方法を定義しない。また，あらゆる置換要素が，そして置換要素だけが内在寸法を持っていると考える。

内容（content）

文書言語のソース文書内において，示された要素範囲に含まれている中身の情報のこと。

要素の内容にはテキスト情報や多くの下位層の要素が含まれ，内容として下位要素を含む要素のことを，下位要素の親であると謂う。要素型の中には内容を持ち得ない空（empty）の物もある； たとえばHTMLのbr要素やimg要素等のごとく。

表現済み内容（Rendered content）

表現済み内容とは，対応するスタイルシートに従ってレンダリングが済んだ内容のこと。

置換要素の内容をレンダリングする方法は，CSS2（CSS2.1）仕様では定義されない。

要素の代替テキスト（HTMLのalt属性値など）として，或いはスタイルシートで直接に――疑似要素および'content'プロパティによって――あるいは暗默的に挿入される項目――リスト項目の先頭につく黒丸や番号など――も表現済み内容と考えられる。

ブロックレヴェル要素とブロックボックス

ブロックレヴェル要素とは，それ自身が直接本文を構成する単位であり，見た目にブロックとして整形される。

たとえばHTMLの要素型では，h1〜h6（見出しレヴェル）やp（段落），ul（順不同リスト）などが該当する。

一般に，ブロック要素はインライン要素および他のブロック要素を含みうる。一般に，インライン要素は単なるテキストおよび他のインライン要素を含みうる。この構造的な性質の差違は，ブロック要素のほうがより "大きな" 構造を生成する，という考えである。

ブロックレヴェル要素は，内部にブロックボックスのみを含む主要ブロックボックスを生成する。

なかには，主要ブロック以外にも更にボックスを生成する物もある。たとえばリスト項目要素――HTMLのli要素； CSSでは 'display: list-item' の要素はマーカーつきのボックスを生成する。こういったボックスは主要ブロックの位置を基準にして配置される。

'display'の値のうち幾つか（たとえば 'block'，'list-item'，'compact'，'run-in'，'table' など）は要素の整形構造をブロックレヴェルに変化させる。ただし 'compact' と 'run-in' は状況に依って生成するボックスの種類が異る。（詳細：ボックスの生成を制禦）。

インライン要素とインラインボックス

インライン要素とは，ソース文書のうち新たにブロックを形成しない要素のことで，常にブロック要素の行内に分散して挿入される。たとえば，段落の途中にある強調テキスト（em）や行内画像（img）など。インライン要素はインラインボックスを生成する。

一般にインライン要素は，テキストや他のインライン要素を内容に含められるが，中身がない空要素もある。

'display' の値のうち幾つか（たとえば 'inline'，'inline-table'，'compact'，'run-in' など）は要素の整形構造をインラインレヴェルに変化させる。ただし 'compact' と 'run-in' は状況に依って生成するボックスの種類が異る。（詳細：ボックスの生成を制禦）

行ボックス（line box）

ひとつの行として構成する複数のインラインボックスが含まれている矩形領域を行ボックス（line box）と呼ぶ。

用字系（script）

国家や地域，民族など，或特定のコミュニティで共通して用いられる，一揃いの文字体系のこと。

用字系というのは，必ずしも特定の言語と“一対一”の関係にあるとは限らない。たとえば，ラテン文字は英語などで用いられるが，元々はラテン語の表記に用いるものであった（今でも学術用語などで用いる）。現今，ラテン文字は欧米を中心として世界中の言語にひろく普及している。私たちの日本語もご存知のとおり，ローマ字表記が可能である。また中国語も，ピン音と呼ばれるラテン転写法がある。

たとえば "中国語" と雖も，必ずしも漢字表記とは限らない。ピン音表記でも中国語なのだから。

テキスト整形やフォントを処理するのに重要になるのはむしろ“用字系”であって，言語ではない。ただし言語慣習に合せた整形規則を必要とするなら，それは尊重する必要がある――たとえば文字の並べ方，両端揃え，語区切り，行区切りなどの規則。

文書ツリー（Document tree）

ソース文書内に記述されたマークづけに基いて生成される，要素の階層構造のこと。（see 下記例）

このツリー内では，最上位のルート要素（HTMLではhtml要素）以外の要素は，必ず一つの親を有する。

親（Parent），子供（Child），子孫（Descendant），祖先（Ancestor）
兄弟（Sibling）
先行要素（Preceding element），後続要素（Following element）

次例は，HTML 4.01仕様に基いた正当（Valid）なソース文書である：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <title>My home page</title>
  <body>
    <h1>My home page</h1>
    <p>Welcome to my home page!
    Let me tell you about my favorite composers:
    <ul>
      <li>Elvis Costello
      <li>Johannes Brahms
      <li>Georges Brassens
    </ul>
  </body>
</html>

この場合，文書ツリーは次のように生成される：
【図】文書ツリー構造の模式――HTML 4文書は，ツリー構造のルートとして必ず1つのhtml要素を有しており，その子供としてhead要素とbody要素を必然的に有している。上述のソース文書に当てはめると，head要素はtitle要素を子要素として1つ持ち，body要素はh1要素，p要素，ul要素の順に子要素を持っている。更にul要素は，項目として3つのli要素を持っている。

HTML4の文書型定義に則せば，ソース文書内にheadタグが存在しなくとも，文書解析の際にはhead要素の存在が推量されて，文書ツリーの一部に組込まれる。同様にパーサは，p要素やli要素の終了タグがソース文書内に存在しなくとも，それらがどこで終了するのか識別できる。（たとえば，p要素はブロックレヴェル要素をまったく内包できないため，次のブロックレヴェル要素が出現した時点で終了する）。

ただしXHTML（およびその他のXML応用言語）で書かれた文書では異っており，要素は推量されない。そして，すべての要素は終了タグを常に備えていなければならない。すなわち，XMLに基づく文書は常に整形式（well-formed）を維持せねばならない。