WEB技術の辞書・解説・使用例

TOP > CSS >  CSS辞典 > caption-side
caption-side 

テーブル(表)のキャプションの位置を指定する

このエントリーをはてなブックマークに追加

top
キャプションをテーブル(表)の上に表示します。これが初期値です。
bottom
キャプションをテーブル(表)の下に表示します。
left
キャプションをテーブル(表)の左に表示します。
right
キャプションをテーブル(表)の右に表示します。

スタイルシート部分は外部ファイル(sample.css)に記述。
caption {
color: #006633;
caption-side: left;
}

HTMLソース
<html>
<head>
<link rel="stylesheet" href="sample.css" type="text/css">
</head>
<body>
<table border="1">
<caption>スタンリー・キューブリックの作品</caption>
<tr><td>1953年</td><td>恐怖と欲望</td></tr>
<tr><td>1956年</td><td>現金に体を張れ</td></tr>
<tr><td>1957年</td><td>突撃</td></tr>
<tr><td>1960年</td><td>スパルタカス</td></tr>
<tr><td>1962年</td><td>ロリータ</td></tr>
<tr><td>1964年</td><td>博士の異常な愛情</td></tr>
<tr><td>1968年</td><td>2001年宇宙の旅</td></tr>
<tr><td>1971年</td><td>時計じかけのオレンジ</td></tr>
<tr><td>1975年</td><td>バリー・リンドン</td></tr>
<tr><td>1980年</td><td>シャイニング</td></tr>
<tr><td>1987年</td><td>フルメタル・ジャケット</td></tr>
<tr><td>1999年</td><td>アイズ・ワイド・シャット</td></tr>
</table>
</body>
</html>