上に標題がある表の図 標題の下マージン及び表の上マージンは縮小される。
表は， データ間の関係を表現する。文書作成者は 文書言語でこれらの関係を指定し， CSSでは視覚及び聴覚という二通りの方法でこれらの表示を指定する。
文書作成者は表の視覚フォーマットをセルの長方形格子として指定してもよい。 セルの行及び列は，行グループ及び列グループに構成されてもよい。行，列， 行グループ，行列及びセルは，周囲に境界を描画する（CSS2には境界モデル が二つ存在する）。文書作成者はあるセル内のデータを上下又は左右に揃えたり，行又は列の全セ ルにデータを揃えてもよい。
文書作成者は，表の聴覚レンダリング，即ち，ヘッダ及びデータが どのように読み上げられるかを指定してもよい。文書言語では, 文書作成者はセル及びセルのグル ープをラベル化してもよい。その結果，聴覚レンダリングされる場合，セルヘッダがセルデータの 前に読み上げられる。実際は，これは表を"直列化"することで，表を聴覚でブラウズする利用者は， ヘッダのシーケンスの後でデータを聞くことになる。
ここでは，HTML4.0で記述される3行，3列の単純な表を例示する。
<TABLE> <CAPTION>This is a simple 3x3 table</CAPTION> <TR id="row1"> <TH>Header 1 <TD>Cell 1 <TD>Cell 2 <TR id="row2"> <TH>Header 2 <TD>Cell 3 <TD>Cell 4 <TR id="row3"> <TH>Header 3 <TD>Cell 5 <TD>Cell 6 </TABLE>
この符号は，一つの表(TABLE要素)，三つの行(TR要素)，三つのヘッダセル(TH要素)及び六つの データセル(TD要素)を生成する。この例の3列は暗黙的に指定されている点に注意すること。即ち, ヘッダ及びデータセルが要求する同数の表の列が存在することになる。
次のCSS規則はヘッダセル内のテキストを左右に中央揃えにし，データを太いフォントのウェイトで表す。
TH { text-align: center; font-weight: bold }
次の規則は，ヘッダセルのテキストを基底線上に揃え，各データセルのテキストを上下に中央揃 えにする。
TH { vertical-align: baseline }
TD { vertical-align: middle }
次の規則は一行目を3pxの青い実線の境界で囲み，その他の行を各々1pxの黒い実線の境界で囲む。
TABLE { border-collapse: collapse }
TR#row1 { border-top: 3px solid blue }
TR#row2 { border-top: 1px solid black }
TR#row3 { border-top: 1px solid black }
しかし，行を囲む境界がセルの境界で重なる点に注意すること。行1と行2との間の境界は何色(黒 又は青)になり，幅(1px又は3px)はどうなるのだろうか？これは， 境界の競合解決で論じる。
次の規則では，表の上部に標題を掲げている。
CAPTION { caption-side: top }
最後に, 次の規則は聴覚レンダリングの場合，データの各行を"ヘッダ，データ，データ"の順に 読み上げるように指定している。
TH { speak-header: once }
例えば, 最初の行は"ヘッダ1 セル1 セル2"の順に読み上げられる。一方，次の規則を使うと，
TH { speak-header: always }
これは， "ヘッダ1 セル1 ヘッダ1 セルl2"の順に読み上げられる。
これまでの例では，CSSがHTML4.0でどのように動作するかを示している。即ち，HTML 4.0では, 様々な表要素(TABLE，CAPTION, THEAD, TBODY, TFOOT, COL, COLGROUP, TH 及び TD)の機能定義を 適切に定めている。XMLアプリケーション等の別の文書言語では，あらかじめ定義された表要素が存 在しない場合がある。そのため，CSS2では，文書作成者が文書言語要素を表要素に "対応付ける"こともできる。その場合には， 'display'特性を用いて対応付けを実施する。例えば，次の 規則により，FOO要素はHTMLのTABLE要素と同様に動作し，BAR要素はCAPTION要素と同様に動作する。
FOO { display : table }
BAR { display : table-caption }
次に，様々な表要素を論じる。この規定では， 表要素という語は，表を生成するあらゆる要素 を表す。 "内部"表要素 は，行，行グループ，列，列グループ又はセルを生成する要素である。
CSS表モデルはHTML4.0表モデルを基礎としている。HTML4.0表モデルでは，表の構造は表の視覚 的レイアウトに非常に近似している。 このモデルでは，表は任意の標題及び数多くのセルの行から 構成される。文書作成者が文書言語で列ではなく行を明示的に指定するため，表モデルは"行優先" であるといわれる。一度行がすべて指定されてから列が派生するのである。例えば，各行の最初の セルは最初の列に属し，二番目のセルは二番目の列に属する。行及び列は構造的にグループ化され てもよく，このグループ化は表示に反映される（例えば，境界は行グループの周囲に描画される）。
従って，表モデルは表，標題，行，行グループ，列，列グループ及びセルから構成される。
CSSモデルは， 文書言語がこれらの各構成要素に対応する要素を包含する ことを要求しない。 XMLアプリケーション等，あらかじめ定義された表要素のない文書言語の場合， 文書作成者は文書言語要素を表要素に対応付けなければならない。これは 'display'特性を用いて実現される。 次の 'display'値は表の機能定義を任意の要素に割り当てる。
'display'が 'table-column' 又は 'table-column-group' に設定される要素はレンダリングされない。正確にいえば，要素が'display: none'であるものとし て扱われる。しかし，表示される列にスタイルを設定する属性を有してもよいため，それらの要素 は有用である。
附属書のHTML4.0のデフォルトスタイルシート では，HTML4.0でこれらの値をどのように使用するかを示す。
TABLE { display: table }
TR { display: table-row }
THEAD { display: table-header-group }
TBODY { display: table-row-group }
TFOOT { display: table-footer-group }
COL { display: table-column }
COLGROUP { display: table-column-group }
TD, TH { display: table-cell }
CAPTION { display: table-caption }
文書作成者が要素の期待された振舞いを変更しないほうがよいため，利用者エージェントはHTML 文書のこれらの'display'特性値を 無視してよい。
HTML以外の文書言語はCSS2表モデルの要素をすべて包含するとは限らない。この場合，表モデル が正しく動作するために，"欠落"要素を仮定しなければならない。欠落要素は，次の規則に従って， 視覚表組みの匿名ボックス等の 匿名オブジェクトを生成する。
次のXMLの例では，'table'要素は，HBOX要素を包含するものと仮定されている。
<HBOX> <VBOX>George</VBOX> <VBOX>4287</VBOX> <VBOX>1998</VBOX> </HBOX>
その理由としては，関連スタイルシートが次であるためである。
HBOX { display: table-row }
VBOX { display: table-cell }
次の例では，三つの'table-cell'要素はROWのテキストを包含すると仮定している。視覚フォーマットモデルで説明されるように，テキストがさ らに匿名行内ボックスに囲まれる点に注意すること。
<STACK> <ROW>This is the <D>top</D> row.</ROW> <ROW>This is the <D>middle</D> row.</ROW> <ROW>This is the <D>bottom</D> row.</ROW> </STACK>
スタイルシートを次に示す。
STACK { display: inline-table }
ROW { display: table-row }
D { display: inline; font-weight: bolder }
HTML利用者エージェントは，上の規則に従って，匿名オブジェクトを生成することを要求されな い。
表セルは，行及び列という二つの文脈に属する。しかし，ソース文書でセルは列の子孫ではなく 行の子孫である。それにもかかわらず，列の特性を設定することにより，セルが影響を及ぼすこと ができる場合もある。
次の特性は列要素及び列グループ要素に適用される。
ここでは，列上の特性を設定するスタイルシートの規則の例をいくつか示す。最初の二つの規則 は，ともに値が"cols"であるHTML4.0の"rules"属性を実装する。三番目の規則は"totals"の列を青 にし，最後の二つの規則は， 固定表組みアルゴリズムを使用することで，どのように列を 固定サイズにするかを示している。
COL { border-style: none solid }
TABLE { border-style: hidden }
COL.totals { background: blue }
TABLE { table-layout: fixed }
COL.totals { width: 5em }
視覚フォーマットモデルに関しては，表はブロックレベル要素又は置換される行内レベル要素と同様に振舞う。表には内容，パディング， 境界及びマージンがある。
いずれの場合も, 表要素は，表ボックス自体及び存在する場合は標題のボックスを包含する匿名ボックスを生成する。 表ボックス及び標題ボックスは 各々内容，パディング，マージン及び境界の各領域を有し，長方形匿名ボックスの寸法は，両者が収ま るのに要する最小限の大きさである。上下マージンは，表ボックス及び標題ボックスが接触するまで縮 小される。表を再配置するいかなる場合でも，表ボックスだけではなく，匿名ボックスごと移動し なければならない。これらにより, 表に従って標題が移動する。
上に標題がある表の図 標題の下マージン及び表の上マージンは縮小される。
| 値: | top | bottom | left | right | inherit |
| 初期値: | top |
| 適用対象: | 'table-caption'要素 |
| 継承: | する |
| パーセント値: | N/A |
| メディア: | 視覚メディア |
この特性は，表ボックスに関連する標題ボックスの位置を指定する。値には次の意味がある。
'table'要素の上又は下の標題は，表の前又は後のブロック要素であるものとしてフォーマット される。ただし，次の場合は例外である。 (1) 継承可能な特性を表から継承する場合， (2) 表に優先するすべての'compact'要素又は'run-in'要素を目的としたブロックボックスである とみなされない場合，である。
表ボックスの上又は下の標題は，幅算出のためのブロックボックスと同様にも振舞う。即ち，幅 は表ボックスの包含ブロックの幅に関連して算出される。
一方で，表ボックスの左側又は右側にある標題については， 'width'に設定された値が'auto'以外であれば 明示的に幅を設定するが，'auto'である場合は，利用者エージェントに"妥当な幅"を選択させる。" 妥当な幅"とは "可能な限り狭いボックス"から "単一行"まで様々であるが, 利用者が左側及び右 側標題幅に'auto'を指定しないことを推奨する。
標題ボックス内で左右に標題内容を揃えるために， 'text-align'特性を使用すること。表ボックスに関連し て左標題ボックス又は右標題ボックスを上下方向に配置する場合は， 'vertical-align' 特性を使用すること。この場合， 意味がある値は'top'，'middle'及び'bottom'だけである。その他の値はすべて'top'と同じものと して処理される。
次の例では, 'caption-side'特性は表の下に標題を配置する。標題 は表の親と同じ幅となり，標題テキストは左揃えになる。
CAPTION { caption-side: bottom;
width: auto;
text-align: left }
次の例は，左マージンにどのように標題を配置するかを示す。左マージン及び右マージンに'auto'を設定することで，表自体は中央に揃えられ，表及び標題を含むボックス全体は，標題の幅だけ左マージンに移動される。
BODY {
margin-left: 8em
}
TABLE {
margin-left: auto;
margin-right: auto
}
CAPTION {
caption-side: left;
margin-left: -8em;
width: 8em;
text-align: right;
vertical-align: bottom
}
表の幅が利用可能な幅より小さいと仮定すると，フォーマット化は次と類似する。
左マージンに侵入する標題を含む中央揃えの表を示す図。これは負の'margin-left'特性の結果である。
文書言語の他の要素と同様に, 表内部要素は内容，パディング及び境界を含む長方形のボックスを生成する。しかし，表内部要素にはマージンはない。
これらのボックスの視覚レイアウトは，長方形，即ち，行及び列の不規則な格子によって支配 される。各ボックスは，次の規則に従って，格子セルのすべての数を占有する。これらの規則はHTML の4.0又はそれ以前の版には適用されない。行及び列の差渡しについては，HTMLには独自の制 限がある。
備考： 表セルは，相対的及び絶対的に配置されてもよいが推奨はしない。配置及び浮動化はボックスを流 し込みから取り除くため，表組みに影響を及ぼすからである。
ここでは例を二つ示す。最初の例は，HTML文書である。
<TABLE> <TR><TD>1 <TD rowspan="2">2 <TD>3 <TD>4 <TR><TD colspan="2">5 </TABLE>
<TABLE> <ROW><CELL>1 <CELL rowspan="2">2 <CELL>3 <CELL>4 <ROW><CELL colspan="2">5 </TABLE>
二番目の例はフォーマットされると，右次図になる。しかし，HTMLの表のレンダリングはHTML によって明示的に定義されず，CSSもそれを定義しようとはしない。利用者エージェントは，左次図 のように，自由にそれをレンダリングする。
左図は不適切なHTML4.0 をレンダリングする可能性の一つ。右図は類似のフォーマット化で，同じ表をHTML以外でレンダリ ングする場合の唯一の可能性。
各表セルの背景を決定するため，表要素は，六つの積み重なった層であると考えるとよい。 ある層で要素に設定される背景は，その上の層の背景が透明である場合だけレンダリングする。
表層のスキーマ
最下層は単一の面であり，表ボックス自体を表示する。すべてのボックスと同様，ここも透明で あってもよい。
次の層は列グループを包含する。列グループは表と同じ高さであるが，表全体を左右方向に覆う 必要はない。
列グループの上部は列ボックスを表示する領域である。列グループと同様，列も表と同じ高さで あるが，左右方向に表全体を覆う必要はない。
次は行グループを包含する層である。各行グループの幅は表と同じである。同様に，行グループ は表を上から下まで完全に覆う。
最後の層の一つ下の層は行を包含する。行も表全体を覆う。
最上層はセル自体を包含する。図で示すように，すべての行で同じ数のセルを包含するが，全セ ルが内容を指定するわけではない。これらの"空の"セルは透明であり，それより下の層を透けて見 せる。
次の例では, 最初の行が四つのセルを包含するが，二番目の行はセルを包含しないので，表背景 は透けて見える。ただし，一行目からこの行にはみ出している部分は例外である。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<STYLE type="text/css">
TABLE { background: #ff0; border-collapse: collapse }
TD { background: red; border: double black }
</STYLE>
</HEAD>
<BODY>
<P>
<TABLE>
<TR>
<TD> 1
<TD rowspan="2"> 2
<TD> 3
<TD> 4
</TR>
<TR><TD></TD></TR>
</TABLE>
</BODY>
</HTML>
上のHTMLコード及びスタイル規則をフォーマット化すると次となる。
下の行に三つ空セルがある表。
多くの場合，何が最適であるかは好みの問題であるので，CSSは表に"最適な"レイアウトを定義 しない。CSSは，表組みする場合，利用者エージェントが尊重しなければならない制約を定義しない。 利用者エージェントは，好みのアルゴリズムを使用してもよいし，レンダリングの正確性よりも速 さを優先するのも自由である。ただし，"固定表組みアルゴリズム"が選択される場合は例外である。
| 値: | auto | fixed | inherit |
| 初期値: | auto |
| 適用対象: | 'table'要素及び 'inline-table'要素 |
| 継承: | しない |
| パーセント値: | N/A |
| メディア: | 視覚メディア |
'table-layout'特性は，表セル，行及び列をレイアウ トするために使用されるアルゴリズムを制御する。値には次の意味がある。
二つのアルゴリズムを次に記述する。
この(迅速な)アルゴリズムでは, 表の左右レイアウトはセルの内容に依存しない。即ち，表の幅， 列の幅及び境界又はセル間スペースにだけ依存する。
表の幅は'width'特性を用いて明示的に指定されてもよい。 'display: table' 及び 'display: inline-table'の両者に対する'auto'の値は，自動表組みアルゴリズムを使用することを意味する。
固定表組みアルゴリズムでは, 各列の幅の次のように決定される。
表の幅は，表要素の 'width'特性の値と，セル間スペースと境界を加味した列幅の合計のうち，大きい方とする。表が列より大きい場合は，余ったスペースは列に分配されるのがよい。
この方法の場合, 一行目全体を受信するとすぐ，利用者エージェントは表組みを開始することが できる。以降に続く行のセルは列の幅に影響を及ぼさない。 オーバーフローする内容を有するセルはどれも 'overflow'特性を使用して，オーバーフローした内容を切 り取るかどうかを決定する。
このアルゴリズムでは、一般に二つしかパスを要求しないが，表の幅はその列の幅（及び介在す る境界）によって提供される。このアルゴリズムは，現規定の執筆時点で の一般的なHTML利用者エージェントの振舞いを反映している。UAは， 'table-layout'が 'auto'である場合， このアルゴリズムを実装して表組みを決定することを要求されない。即ち，UAは別のアルゴリズム を使用することができる。
このアルゴリズムは，最終的レイアウトの決定以前に，表の内容のすべてにアクセスすることを 利用者エージェントに要求するため，非効率であってもよく，一つより多くのパスを要求してもよ い。
列幅の決定方法を次に示す。
同様に, 各セルの"最大" セル幅を算出する。明示的に行区切りが生じる位置以外で行を区切ら ずに内容をフォーマットする。
これにより，各列の最大幅又は最小幅が提供される。列幅が最終的な表にどのように影響するか を次に示す。
列幅のパーセント値は，表幅に関連している。表が'width: auto'という値を有する場合, パー セントは列の幅に関する制約を表現する。この制約とは，UAができるだけ満足するのが望ましい制約で ある。（明らかに，これは常に可能なわけではない。例えば，列の幅が'110%'であるという制約は， 満足できるものではない。）
備考： このアルゴリズムでは, 行(及び行グループ)，列(及び列グルー プ)は両者とも，包含するセルの寸法と制約し，制約される関係である。列の幅を設定すると，間接 的に行の高さに影響する。その逆も同様である。
表の高さは，'table'要素又は'inline-table'要素の'height' 特性によって提供される。'auto'という値は，高 さが行の高さにあらゆるセル間スペース又は境界を加味した合計であることを意味する。その他の 値はいずれも高さを明示的に指定する。従って，表はその行の高さよりも高くてもよいし，低くて もよい。CSS2は，指定された表の高さが内容の高さとは異なる場合，レンダリングを指定しない。 特に内容の高さが指定された高さを上書きするのがよいかどうか，上書きしない場合，指定された 表の高さに合わせて余ったスペースを行にどのように分配するのがよいか，内容の高さが指定され た表の高さを超える場合，UAがスクロール機構を提供するのがよいか，を指定しない。
備考 将来リリースされるCSSの版ではこれをさらに規定していく。
'table-row' 要素のボックスの高さは，利用者エージェントが利用可能な行のすべてのセルを有 してはじめて算出される。即ち，行の指定の 'height'とセルが要求する 最小の高さ(MIN)のうちの最大値とする。'table-row'に対する'auto'の 'height'値は，算出される行の高さがMINであることを意味 する。MINはセルボックスの高さ及びセルボックスの配置に依存する (行ボックスの高さの算出に非常に類似する)。CSS2は， 表 の行及び行グループに指定される場合， 'height'のパーセントが何を表すかを定義しない。
CSS2では, セルボックスの高さは表セルの'height' 特性の最大値であり，内容 が要求する最小の高さ(MIN)である。 'height'に対する'auto'の値はMINの計算値を意味する。 CSS2は，表セルに指定される場合，'height'のパーセント値が何を意味するのかを定義しない。
CSS2は，複数行にまたがるセルが行の高さの算出にどのように影響するかを指定しない。ただし， 包含される行の高さの合計が行をまたぐセルを含むのに十分なだけ大きくなければならない。
各表セルの'vertical-align' 特性は，行内の表セルの配置を決定する。各セルの内容には，基底線, 上線，中央線，下線がある が，これは行自体と同様である。表の文脈では， 'vertical-align'に対する値には，次の意味がある。
セルの基底線はセルの最初の 行ボックスの基底線である。セルにテキストが存在し ない場合，基底線は，セルに表示されているオブジェクトの基底線である。このオブジェクトは何 であってもよい。セルが何も包含しない場合，基底線はセルボックスの下辺である。セルボックス の上辺と，'vertical-align'を有するすべてのセルにわたる基底線との最大距離は，行の基底線を 設定するために使用される。次に例を示す。
表セルに対する'vertical-align'の値の様々な効果を示す図。
セルボックス 1及びセルボックス 2はその基底線に揃えられる。セルボックス2の方が基底線か ら上線までの距離が大きいため，行の基底線を決定する。基底線に揃うセルボックスが存在しない 場合，行には基底線がないことになり，基底線を有する必要もなくなる点に注意すること。
曖昧な状況を回避するため, セルを次の順序で配置するものとする。
行の高さより小さいセルボックスは，上下の余った部分にパディングを詰める。
セルボックス内のセルの内容を左右方向に配置する場合は， 'text-align'特性を用いて指定する。
列の一つ以上のセルに対して 'text-align' 特性に<string>値を設定する場合, それらのセルの内容は上下軸に沿って揃えられる。文字列の先頭がこの軸に接触する。文字の 方向性によって，文字列が軸の左にくるか右にくるかが決定される。
テキストが一行に収まる場合だけ，この方法での揃え方が有用である。セル内容が一行以上にま たがる場合，結果は定義されない。
表セルの'text-align'の値が文字列であっても，文字列 がセル内容に出現しない場合，セルの内容の末尾を配置の上下軸とする。
通常，文字列は各セルについて同じであるが，この場合その必要がない点に注意すること。
CSSは，列ボックスの辺に関連した上下配置軸のオフセットを指定する方法を提供しない。
次にスタイルシートの例を示す。
TD { text-align: "." }
TD:before { content: "$" }
上のスタイルシートを次のHTML表に適用する。
<TABLE> <COL width="40"> <TR> <TH>Long distance calls <TR> <TD> 1.30 <TR> <TD> 2.50 <TR> <TD> 10.80 <TR> <TD> 111.01 <TR> <TD> 85. <TR> <TD> 90 <TR> <TD> .05 <TR> <TD> .06 </TABLE>
上の例では，ドルで表される数字の列は小数点で揃えられる。さらに、この例では， :before擬似要素を使用し て，各数字の前にドル記号を挿入してみた。表をレンダリングすると次のようになる。
Long distance calls
$1.30
$2.50
$10.80
$111.01
$85.
$90
$.05
$.06
'visibility' 特性は，行，行グループ，列 及び列グループ等の要素について，'collapse'という値をとる。この値により，行又は列全体が表 示から取り除かれ，スペースは通常，他の内容に利用できる行又は列によって埋められる。しかし， 行又は列が詰められたとしても，その他の点で表組みには影響しない。これにより，動的に表の行 又は列を除去できるが，その場合でも，列の制約にある潜在的変更を考慮して表の再表組みを強制 しない。
CSSでは，表セルに境界を設定するためモデルとして，異なるモデルが二つ存在する。一つは， いわゆる 分離境界で，個々のセルを囲むもの場合に適する境界であ り，もう一つは，ある表の端から終端まで連続する境界に適するものである。境界スタイルの多く は，いずれかのモデルを用いて実現できるため，どちらを使用するかは好みの問題であることが多 い。
| 値: | collapse | separate | inherit |
| 初期値: | collapse |
| 適用対象: | 'table'要素及び'inline-table' 要素 |
| 継承: | する |
| パーセント値: | N/A |
| メディア: | 視覚メディア |
この特性は表の境界モデルを選択する。'separate'という値は，分離境界モデルを選択する。 'collapse'という値は境界つぶしモデルを選択する。これらのモデルについて次に記述する。
| 値: | <length> <length>? | inherit |
| 初期値: | 0 |
| 適用対象: | 'table' 要素及び 'inline-table' 要素 |
| 継承: | する |
| パーセント値: | N/A |
| メディア: | 視覚メディア |
長さは，隣接するセル境界を分離する距離を指定する。ある長さが指定されると，左右間隔及び 上下間隔の両方が決定する。二つの長さが指定される場合，最初の長さは左右間隔を決定する値で あり，二番目の長さは上下間隔を決定する値である。長さに負の値をとるのはよくない。
このモデルでは, 各セルには個々の境界がある。 'border-spacing' 特性は，隣接するセルの境界間 の距離を指定する。このスペースは，表要素の背景で埋められる。行，列，行グループ及び列グル ープが境界を有することはできない。即ち，利用者エージェントはそれらの要素の境界特性を 無視しなければならない。
次に，スタイルシート及びその適用例を示す。
TABLE { border: outset 10pt;
border-collapse: separate;
border-spacing: 15pt }
TD { border: inset 5pt }
TD.special { border: inset 10pt } /* The top-left cell */
'border-spacing'に長さの値を設定した表。各セル には各々の境界が存在し，表にも分離境界が存在する点に注意すること。
| 値: | show | hide | inherit |
| 初期値: | show |
| 適用対象: | 'table-cell' 要素 |
| 継承: | する |
| パーセント値: | N/A |
| メディア: | 視覚メディア |
分離境界モデルでは, この特性は可視内容のないセルを囲む境界のレンダリングを制御する。空 セル及び'visibility'特性が'hidden'に設定されているセルは 可視内容がないものとみなされる。可視内容は" " 及び ASCII CR ("\0D"), LF ("\0A"), タブ("\09") 及びスペース("\20")を除くその他の空白を包含する。
この特性の値が 'show'である場合, 境界は，通常のセルと同様，空セルの周囲に描画される。
'hide'という値は，空セルの周囲に境界が描画されないことを意味する。さらに，行のすべて のセルの値が'hide'であり，可視内容がない場合，行全体の振舞いは値が'display: none'である場 合と同じである。
次の規則により，境界はすべてのセルの周囲に描画される。
TABLE { empty-cells: show }
境界つぶしモデルでは, セル，行，行グループ，列，列グループのすべて又は一部を囲む境界を指 定できる。HTMLの"rule"属性の境界をこの方法で指定することができる。
境界はセル間の格子線を中央の軸として揃えられる。利用者エージェントは，画面画素，プリン タドットなど個々の単位が奇数である場合，値を丸めるために，一貫した規則を発見しなければな らない。
下の図は，表の幅，境界の幅，パディング及びセルの幅がどのように相互に作用するかを示す。 次の等式はそれらの関係を表している。表のあらゆる行はこの等式に従う。
row-width = (0.5 * border-width0) + padding-left1 + width1 + padding-right1 + border-width1 + padding-left2 +...+ padding-rightn + (0.5 * border-widthn)
ここでの n は，行のセル数であり， border-widthiはセル i と i + 1との間の境界を表す。 二つの外境界のうち半分だけが表の幅に入る点に注意すること。これら二つの境界のうちのもう半分はマージン領域に入る。
セルの幅並びに境界及びセルのパディングを 表すスキーマ。
このモデルでは，表の幅は表境界の半分を包含する点に注意すること。同様に，このモデルでは，表にパディングが存在しない。しかし，マージンは存在する。
境界つぶしモデルでは, あらゆるセルのあらゆる辺の境界が，セル，行，行グループ，列，列グル ープ及び表自体の辺で接触する様々な要素の境界特性によって指定されてもよい。さらに，これ らの境界は幅，スタイル及び色が異なってもよい。競合解決の規則は，各辺で最も"目を引く"境界 スタイルが選択されることである。ただし，スタイル'hidden'が出現する場合はいかなる場合も， 無条件に境界は表示されない。
次の規則は，競合する場合に，どの境界スタイルが“適用される”かを決定する。
次の例は，これらの優先規則のアプリケーションを示す。
TABLE { border-collapse: collapse;
border: 5px solid yellow; }
*#col1 { border: 3px solid black; }
TD { border: 1px solid red; padding: 1em; }
TD.solid-blue { border: 5px dashed blue; }
TD.solid-green { border: 5px solid green; }
上のスタイルシートを次のHTMLソースに適用する。
<P>
<TABLE>
<COL id="col1"><COL id="col2"><COL
id="col3">
<TR id="row1">
<TD> 1
<TD> 2
<TD> 3
</TR>
<TR id="row2">
<TD> 4
<TD class="solid-blue"> 5
<TD class="solid-green"> 6
</TR>
<TR id="row3">
<TD> 7
<TD> 8
<TD> 9
</TR>
<TR id="row4">
<TD> 10
<TD> 11
<TD> 12
</TR>
<TR id="row5">
<TD> 13
<TD> 14
<TD> 15
</TR>
</TABLE>
上のHTMLソース及びスタイルシートをレンダリングすると，次となる。
境界つぶしのある表の例
次の例は，行間に左右罫線のある表を示す。表の上境界は'hidden'に設定され，最初の行の上境 界を表示しない。これは，HTML4.0の"rule"属性(rules="rows")を実装する。
TABLE[rules=rows] TR { border-top: solid }
TABLE[rules=rows] { border-collapse: collapse;
border-top: hidden }
行間に左右罫線のある表
この場合，TABLEに'hidden'境界を設定しないで，最初の行を別に指定することで，同じ効果を 得ることもできる。どちらの方法を選択するかは，好みの問題である
TR:first-child { border-top: none }
TR { border-top: solid }
ここでは，境界つぶしモデルをさらに一例を挙げる。
省略される内部境界が二本ある表
HTMLのソースを次に示す。
<TABLE style="border-collapse: collapse; border: solid;">
<TR><TD style="border-right: hidden; border-bottom: hidden">foo</TD>
<TD style="border: solid">bar</TD></TR>
<TR><TD style="border: none">foo</TD>
<TD style="border: solid">bar</TD></TR>
</TABLE>
'border-style' の値には，表に適用されると意味が変わってしまうものもある。次のリストで，それらがアスタリ スク（＊）でマーク付けされている。
表が音声生成器により読み上げられる場合，データセルとヘッダセルとの関係は,左右配置及び 上下配置とは異なる方法で表現されなければならない。音声ブラウザには，利用者が二次元平面内 を移動することにより,位置的に出力される関係を対応付けるものもある。それができない場合，ス タイルシートはヘッダをどの位置で読み上げるかを指定しなければならない。
| 値: | once | always | inherit |
| 初期値: | once |
| 適用対象: | 表ヘッダ情報を有する 要素 |
| 継承: | する |
| パーセント値: | N/A |
| メディア: | 聴覚的メディア |
この特性は，表ヘッダがすべてのセルの前に読み上げられるどうか若しくはそのセルが前の セルと異なるヘッダを有する場合だけ読み上げるかどうかを指定する。値には次の意味がある。
各文書言語には，文書作成者がヘッダを指定できる様々な機構が存在する。 例えば，HTML 4.0 ([HTML40])では, 三つの異なる属性("headers"， "scope"及び"axis")を用いて，ヘッダ情報を指定することができ，規定は，これらの属性が指定さ れていない場合に，ヘッダを決定するためのアルゴリズムを提供している。
適用されるデータと同じ列又は行に存在しないヘッダセル("San Jose" 及び "Seattle")のある表の画像。
次のHTML例は，二つの場所(San Jose及びSeattle)における，数日間の食費，宿泊費及び旅費を 示したものである。概念的には, n次元平面に関する表を考慮することができる。このスペースのヘ ッダは，場所，日付，カテゴリ及び小計である。軸に沿ってマークを定義するセルもあれば, この スペース内の点で出費を表示するセルもある。この表のマーク付けを次に示す。
<TABLE> <CAPTION>Travel Expense Report</CAPTION> <TR> <TH></TH> <TH>Meals</TH> <TH>Hotels</TH> <TH>Transport</TH> <TH>subtotal</TH> </TR> <TR> <TH id="san-jose" axis="san-jose">San Jose</TH> </TR> <TR> <TH headers="san-jose">25-Aug-97</TH> <TD>37.74</TD> <TD>112.00</TD> <TD>45.00</TD> <TD></TD> </TR> <TR> <TH headers="san-jose">26-Aug-97</TH> <TD>27.28</TD> <TD>112.00</TD> <TD>45.00</TD> <TD></TD> </TR> <TR> <TH headers="san-jose">subtotal</TH> <TD>65.02</TD> <TD>224.00</TD> <TD>90.00</TD> <TD>379.02</TD> </TR> <TR> <TH id="seattle" axis="seattle">Seattle</TH> </TR> <TR> <TH headers="seattle">27-Aug-97</TH> <TD>96.25</TD> <TD>109.00</TD> <TD>36.00</TD> <TD></TD> </TR> <TR> <TH headers="seattle">28-Aug-97</TH> <TD>35.00</TD> <TD>109.00</TD> <TD>36.00</TD> <TD></TD> </TR> <TR> <TH headers="seattle">subtotal</TH> <TD>131.25</TD> <TD>218.00</TD> <TD>72.00</TD> <TD>421.25</TD> </TR> <TR> <TH>Totals</TH> <TD>196.27</TD> <TD>442.00</TD> <TD>162.00</TD> <TD>800.27</TD> </TR> </TABLE>
この方法でデータモデルを提供することにより，文書作成者は，読み上げ可能なブラウザに様々 な方法で表を分析させることができる。例えば，各セルをリストとして出力し，各データセルごと に適用可能なヘッダを繰り返すことができる。
San Jose, 25-Aug-97, Meals: 37.74 San Jose, 25-Aug-97, Hotels: 112.00 San Jose, 25-Aug-97, Transport: 45.00 ...
ブラウザは，ヘッダが変更された場合だけ，ヘッダを読み上げることもできる。
San Jose, 25-Aug-97, Meals: 37.74
Hotels: 112.00
Transport: 45.00
26-Aug-97, Meals: 27.28
Hotels: 112.00
...