|
テーブルに、キャプション (表題・題名)を設定する
|
|
|
中級編 【8】
テーブルに、キャプション(表題・題名)を指定する
テーブルに題名を付けるタグで、
(表題・題名)タグは
<tr> <td>
より前の
<table>
タグの、直後に指定する。
<caption> </caption>
要素
表にキャプション (表題・題名)を設定する
|
(表題・題名)の規定値は、センターリングして表示されるが、
alignで任意の位置を指定する事が出来る。
| |
|
(注1)キャプションの表示位置指定は、IEの拡張機能でほかのブラウザでは
非推奨となっていて
ネットスケープ・オペラでは,キャプション(表題・題名)の表示位置指定をしても機能しない。
無指定か、スタイルで位置を指定します。
|
|
|
|
指定する場合は、
<head></head>
の範囲に、
style(css)
で
caption { text-align: left; }
で指定するか、
ページの指定箇所で個別に、
<caption style="text-align: left;"> </caption>
のように指定する。
|
|
|
|
テーブル、(表題・題名)表示サンプルタグ。
<table width="90%" border="1">
<caption>キャプションはこの様に表示される</caption>
<tr>
<td width="20%">
セル 1
</td>
<td width="30%">
セル 2
</td>
<td width="50%">
セル 3
</td>
</tr> </table>
|
|
|
|
|
|
|
タグのサンプルに、背景色・文字色・高さを指定 表示しています。
|
(表題・題名)は、この様に表示される。
| セル 1
|
セル 2
|
セル 3
|
| |
| |
背景色・文字色・高さを指定 枠を消して表示しています。
|
(表題・題名)は、この様に表示される。
| セル 1
|
セル 2
|
セル 3
|
|
|
|
|
|
表題・題名(キャプション)の表示位置を指定
<caption align="">
((表題・題名))(キャプション)の表示位置を指定
</caption>
|
align=
|
""
|
属性
|
(表題・題名)の位置を指定する
(規定値)はセンターリング表示
|
|
"
top
"
|
属性値
|
((表題・題名))を、テーブルの上部に付けるデフォルト
(規定値)。
|
|
"
bottom
"
|
属性値
|
((表題・題名))を、テーブルの下部に付ける。
|
|
"
left
"
|
属性値
|
(表題・題名)を、テーブルの左側に付ける。
|
|
"
right
"
|
属性値
|
(表題・題名)を、テーブルの右側に付ける。
|
|
其のほか サイズ指定 枠幅・高さ HTMLタグ解説
|
|
要素 属性
<table width=" ">
|
属性値
は、10進数ビクセル単位で指定する。
テーブル全体に枠幅を設定。
|
|
|
<table width=" " height=" ">
|
テーブル全体に、枠幅と枠の高さを設定。
|
|
|
<td width=" ">
|
複数のセルを設定した場合に、セルに枠幅を設定。
|
|
|
<td width=" " height=" ">
|
複数のセルに、枠幅と高さを設定。
|
|
|
<table border=" ">
|
テーブル枠の表示(サイズ)、非表示 0で非表示
|
|
|
(注1)
要素
<caption>
の位置指定の機能は、
HTML4.1以降XHTML1.0
では非推奨となっています。
| |
|
非推奨とは、
将来的に、次期バージョンで
いずれ廃止となる予定の機能の事で、CSSなどに移行して代替タグが有る場合と完全に廃止されるものがある。
その他、各ブラウザに共通機能ではない拡張機能も非推奨とされています。
講座主催者が、推し薦める事ではないが現時点のブラウザのシェアはIEの独走状態(95.5%)で、IEの拡張機能のタグを
否定するのも如何なものかと思うのですが、、、。
ブラウザIEのシェアは?
から
|
|
|
|
|
|
|
|
|
|