Go to information

caption-side

caption-sideプロパティは表組に付けるキャプション（表題）の表示位置を指定します。

値
初期値
top
適用対象
表のキャプション要素（caption要素）
継承
する
メディア
visual

caption-sideプロパティに指定できる値のキーワードはそれぞれ以下の意味を示します。

top
キャプションを表組の上に配置（表組の上で水平方向は中央揃え）
bottom
キャプションを表組の下に配置（表組の下で水平方向は中央揃え）
left
キャプションを表組の左に配置
right
キャプションを表組の右に配置

なお、"top"、または "bottom" の値を指定した場合の水平方向の揃え方は text-alignプロパティで指定することが可能です。

caption-sideプロパティの実装状況

Windows版Internet Explorer
×
Firefox
○
Opera
○（"left", "right" の値は未実装）
Safari
○（"left", "right" の値は未実装）
Macintosh版Internet Explorer 5
○（"left", "right" の値は未実装）

Windows版Internet Explorer 6、及び Windows版Internet Explorer 7 は caption-sideプロパティに対応しておらず、デフォルトではキャプションは表組の上に配置され、内容は水平方向が中央揃えになっていますが、text-alignプロパティによる水平方向の揃えは反映されます。

サンプル

記述例
.calendar caption {
caption-side : bottom ;
text-align : right ;
font-weight : bold ;
font-size : 2em ;
color : navy ;
}
表示例

caption-sideプロパティで表組の下にキャプション（表題）を配置し、text-alignプロパティで水平方向を右揃えに指定しています。

現在位置
  1. W3G
  2. CSS
  3. テーブル
  4. caption-side
ナビゲーション
ステータス情報
作者
上田 遼
公開
2007-02-02T16:07:05+09:00
更新
2008-12-29T04:30:37+09:00
URI
http://w3g.jp/css/table/caption-side
検索

直近の制作実績等：大阪人間科学大学 New! / 大阪薫英女子短期大学 New! / セキスイハイム みんなのお国じまん New!