- PR -

CSSによるTable内セル罫線の一括設定方法

1
投稿者投稿内容
e3000
会議室デビュー日: 2004/02/06
投稿数: 19
お住まい・勤務地: 東京
投稿日時: 2004-12-22 15:23
いつも参考にさせて頂いております。

TableとCSSに関する質問なのですが、
画面上にある特定のTableを作成し、そのTable内の罫線の色について、
Tableの"bordercolor"属性でなくスタイルシートで指定することは、可能でしょうか。

いろいろ試してみたところ、対象となるTableに対するCSSでは、外枠だけにしか
適用されず、内部罫線に適用するためには、各セル<TD>にCSSを設定しなければ
ならいようです。

どうにかCSSにて、Table内部の罫線まで一括指定する方法はないでしょうか。

よろしくお願い致します。
okutin
ベテラン
会議室デビュー日: 2003/12/11
投稿数: 98
お住まい・勤務地: 広島
投稿日時: 2004-12-22 16:36
こんにちは。

引用:


TableとCSSに関する質問なのですが、
画面上にある特定のTableを作成し、そのTable内の罫線の色について、
Tableの"bordercolor"属性でなくスタイルシートで指定することは、可能でしょうか。



可能です。

引用:


いろいろ試してみたところ、対象となるTableに対するCSSでは、外枠だけにしか
適用されず、内部罫線に適用するためには、各セル<TD>にCSSを設定しなければ
ならいようです。



borderとは対象となる要素の枠線のことですから、table要素のborderはtable単位、つまりtableの外側の線だけなのが当たり前です。

引用:


どうにかCSSにて、Table内部の罫線まで一括指定する方法はないでしょうか。




<style type="text/css">
table,td{
border: 1px solid red;
}
このような感じすればよいと思います。
.netは知らないので.netでできるのかは知りませけど。
e3000
会議室デビュー日: 2004/02/06
投稿数: 19
お住まい・勤務地: 東京
投稿日時: 2004-12-22 16:53
okutinさん、ありがとうございます!

ただ、

style type="text/css">
table,td{
border: 1px solid red;
}

の書き方だと、画面上複数のTableがあった場合、
すべてのTableに適用されてしまいます。

行いたいのは、画面上ある特定のTableについて
その罫線までの一括指定なんです。

<TD>にCssClassを設定し、適用させる方法は、
各<TD>要素のClass属性を全て設定しなければならず、
もっと効率的な方法はないかと考えています。
okutin
ベテラン
会議室デビュー日: 2003/12/11
投稿数: 98
お住まい・勤務地: 広島
投稿日時: 2004-12-22 17:08
こんにちは。

引用:


e3000さんの書き込み (2004-12-22 16:53) より:

行いたいのは、画面上ある特定のTableについて
その罫線までの一括指定なんです。




なるほど、でしたら以下のような方法はいかがでしょう?

その1
table,td{
border: 1px solid red;
}
table.hoge{
border-color: green;
}

その2
table.hoge td{
border: 1px solid green;
}

両方とも、table要素にだけクラスhogeを指定すれば大丈夫なはずです。
e3000
会議室デビュー日: 2004/02/06
投稿数: 19
お住まい・勤務地: 東京
投稿日時: 2004-12-22 17:44
okutinさん、ありがとうございます!

うまく一括で指定できました!!

Tableタグだけでなく別の要素にも応用できそうです。

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

スキルアップ/キャリアアップ(JOB@IT)