table要素は表の全体を宣言する要素です、<table>タグの中に<tr>タグ、<td>タグを入れて使います。
tr要素は表の行を作成する要素です、<tr>タグは<table>タグの中に入れて使います。
終了タグは省略できます。
td要素はセル(内容を書く部分)を作成する要素です、<td>タグは<table>タグの中に入れてさらに<tr>タグの中に入れて宣言します。
終了タグは省略できます。
<table border="1"> <tr> <td>ココに内容を書きます<td> <td>trタグ内に二個のtdタグを宣言しているので一つの行にセルが二つです<td> </tr> <tr> <td>このtr、tdタグに終了タグが付けてません <td>このtr、tdタグに終了タグが付けてません </table>
ココに内容を書きます | trタグ内に二個のtdタグを宣言しているので一つの行にセルが二つです |
このtr、tdタグに終了タグが付けてません | このtr、tdタグに終了タグが付けてません |
属性名 | 値 | 概要 |
---|---|---|
align | center | 表を中央揃えで表示 |
right | 表を右揃えで表示 | |
left | 表を左揃えで表示 | |
background | 画像ファイル | 絶対パスか相対パスで背景画像を指定 |
bgcolor | #RRGGBB | #000000等の16進数で2桁ずつ背景色を宣言し、細かく設定できる |
red | 色名で背景色を指定する、この場合は背景を赤色にする | |
border | px | pxで枠の太さを設定 |
bordercolor | #RRGGBB | #000000等の16進数で2桁ずつ枠の色を宣言し、細かく設定できる |
red | 色名で枠の色を指定する、この場合は枠を赤色にする | |
bordercolorlight ※1 |
#RRGGBB | #000000等の16進数で2桁ずつ外線の光の色を宣言し、細かく設定できる |
red | 色名で外線の光の色を指定する、この場合は光を赤色にする | |
bordercolordark ※1 |
#RRGGBB | #000000等の16進数で2桁ずつ外線の影の色を宣言し、細かく設定できる |
red | 色名で外線の影の色を指定する、この場合は影を赤色にする | |
frame※1 | void | 外線を表示しない |
above | 上の外線のみ表示 | |
rhs | 右の外線のみ表示 | |
below | 下の外線のみ表示 | |
lhs | 左の外線のみ表示 | |
hsides | 上下の外線のみ表示 | |
vsides | 左右の外線のみ表示 | |
border | 外線全て表示 | |
rules※1 | none | 内線を表示しない |
cols | 縦の内線のみ表示 | |
rows | 横の内線のみ表示 | |
all | 内線全て表示 | |
summary | 文字 | 表の概要を記述 |
width | px,% | pxか%で表の幅を設定 |
height※2 | px,% | pxか%で表の高さを設定 |
hspace※3 | px | pxで表の上下の余白を設定 |
vspace※3 | px | pxで表の左右の余白を設定 |
cellpadding | px | px単位でセルの枠の余白の設定 |
cellspacing | px | px単位で表の外線とセルの余白の設定 |
※1:未対応ブラウザ:NN、Safari
※2:未対応ブラウザ:Safari
※3:未対応ブラウザ:IE、Safari、OPERA、Firefox
属性名 | 値 | 概要 |
---|---|---|
align | center | 行のセル内を中央揃えで表示 |
right | 行のセル内を右揃えで表示 | |
left | 行のセル内を左揃えで表示 | |
valign | baseline | 行のセル内をベースラインに揃える |
top | 行のセル内を上に揃える | |
middle | 行のセル内を中央に揃える | |
bottom | 行のセル内を下に揃える | |
bgcolor | #RRGGBB | #000000等の16進数で2桁ずつ背景色を宣言し、細かく設定できる |
red | 色名で背景色を指定する、この場合は背景を赤色にする |
属性名 | 値 | 概要 |
---|---|---|
align | center | 行のセル内を中央揃えで表示 |
right | 行のセル内を右揃えで表示 | |
left | 行のセル内を左揃えで表示 | |
valign | baseline | 行のセル内をベースラインに揃える |
top | 行のセル内を上に揃える | |
middle | 行のセル内を中央に揃える | |
bottom | 行のセル内を下に揃える | |
bgcolor | #RRGGBB | #000000等の16進数で2桁ずつ背景色を宣言し、細かく設定できる |
red | 色名で背景色を指定する、この場合は背景を赤色にする | |
width | px,% | pxか%でセルの幅を設定 |
height | px,% | pxか%でセルの高さを設定 |
colspan | 数字 | 入れられた値分、横のセルと連結する |
rowspan | 数字 | 入れられた値分、縦のセルと連結する |
nowrap | nowrap | 自動改行の禁止 <td nowrap>と宣言する |
表はCSS・スタイルシートも少し使い辛く分かり難いと思いますが中々便利です。
少々面倒ですがdiv要素で表を作ることもできます。