html上でのtableのborder指定

質問

htmlにstyleを用いてtableのborderを適用させる方法を教えて下さい。

cssが使えないのでhtmlに指定させたときに、各セルごとだけにボーダーを適用させる方法はありませんか？

各セルの個数がバラバラなので、tableに指定すると、大きい外枠にborderが付いてしまいます。

画像のような形にしたいのですが、教えて下さい。

回答No.3

DrFell · ベストアンサー

style=css=スタイルシートです。質問がなりたちません。
質問もあやふやな部分が多くもう少し、詳しく説明いただかないと、ｃｓｓをどの意味で使っておられるのかわからないです。
スタイルシートは、
1.別ファイルに書く方法
2.head内に書く方法
3.出てきた文中にかく方法
の3つがあります。どれもスタイルシートで、ｃｓｓです。3.の方法はスタイルシートとしては、もっとも恩恵を受けない、避けるべき方法ですが、それをご希望とも取れます。

個別に対応するには、今回の場合、
1.tdだけに罫線を引く方法（すべてのtdに罫線を付ける）
2.tdにクラスを付ける方法（ｔｄの中でも区別したtdに罫線を付ける）
3.文中（インライン）のtdに書く方法
があります。

つまり、別ファイルに書いたり、ページに1回だけ書くｃｓｓでも、特定のｔｄにだけ罫線を付けることは可能です。

どのスタイルをとるにしても、
border:1px solid #999;
で適用できると思います。

もっともｃｓｓの恩恵が少なく、避けるほうがよいが、質問で求めているのは
<td style="border:1px solid #999">
かな？と思います。

が
>各セルの個数がバラバラなので、tableに指定すると、大きい外枠にborderが付いてしまいます。
これが原因でｃｓｓが使えないと思っておられるなら、誤解ですので、もっとよい方法別ファイルのcssに各方法をお勧めします。そして本当に、ｃｓｓが使えないなら、どの方法も有効になりません。今回どこを誤解されているのかわからず、エスパーしてみました。外していたらスルーください。

お礼

ありがとうございました。
cssの考え方が間違っていました。
お教えいただいた通り”文中への表記方法”が分かりませんでした。

CSSが使えないというのは外部スタイルシートが適用できないという意味です。
htmlの文中に直接書く方法もcssにあてはまるのですね。

<td style="border:1px solid #999">
でうまくボーダーが表示できました。

ありがとうございました。

回答No.2

ORUKA1951

「CSSが使えない」とはどういう意味ですか？

borderは継承されるプロパティではありませんから、その子孫であるtr,th,tdにはborderは付きません。HTMLのborder属性とは違います。
よって、
CSSで指定するなら、
table{border:solid red 1px;border-collapse:collapse;empty-cells:hide;}
table td{border:solid green 1px;}
table th{border:solid blue 1px;}
とかになります。

<table summary="test">
　<tbody>
　　<tr>
　　　<th abbr="あ行">あ行</th><td>あ</td><td>い</td><td>う</td><td>え</td><td>お</td>
　　</tr>
　　<tr>
　　　<th abbr="や行">や行</th><td>や</td><td></td><td>ゆ</td><td></td><td>よ</td>
　　</tr>
　</tbody>
</table>
だと、
table[summary="test"]{border:solid red 1px;border-collapse:separate;empty-cells:hide;border-spacing:5px;}
table[summary="test"] th,table[summary="test"] td{border-style:solid;border-color:black gray gray black;border-width:1px 3px 3px 1px;}
{border:solid blue 1px;}
とか・・

お礼

ありがとうございました。

CSSが使えないと言うのは、外部CSSが適用できないという意味です。
自分自身、文中へ直接styleを用いて表記する方法もcssだという事を知りませんでした。

うまく伝えられなかったのに、丁寧にありがとうございました。

回答No.1

noname#158634

CSSが使えないというのはどういう意味だか分かりませんが、tableタグのborder属性によって表示される枠線を任意のセルにだけ適用したいのであれば無理です。

お礼

ありがとうございました。
書き方が悪く、伝えにくくてすみません。

CSSが使えないというのは外部スタイルシートが適用できないという意味でした。すみません。