はじめまして。
Webページで、テーブルを作成する際の正しい手順について迷ってしまっているので、ご助力いただければ幸いです。
現在、XHTML1.0TとCSSでページを作成しています。
テーブルの作成は以前からしていましたが、CSSが絡むようになってから、どの方法がベストなのかがわかりません。
作成はDreamweaverとテキストエディタでの手書きと両方行っています。
疑問を抱いているのは、以下の点です。
☆ HTMLの<table>に対するborder属性、width属性、cellspacing属性、cellpadding属性は使用するべきなのか？
今現在は、<table><tr><th><td>のみで骨格を作成し、属性指定は行っておりません。するとすればthのscope属性くらいです。
ボーダーの指定には、table th tdそれぞれにCSSで上下左右のボーダー指定を行い、border-collapseプロパティで、セル間の隙間をなくしています。横幅もCSSのwidthプロパティを使用しています。
セル内の余白については、thやtdに対してpaddingプロパティで指定をしております。
この方法で特に問題なくできてはいるのですが、実際にwidth border cellpadding cellspacingの属性がいまだに非推奨になっていないようですし、ちょっと不安です。
みなさんはどのように作成しているのでしょうか？
Dreamweaverの参考書などでは、tableに対して上と左のボーダー、tdに対して、右と下のボーダーを指定して、border-collapseで隙間をつぶす方法が紹介されていたりもしました。
ただ、自分は、tdの上下左右のボーダーを指定してborder-collapseで隙間をなくしていますが、結果は同じ表記になります。
tableに上と左のボーダー、tdに右と下のボーダーと指定すること自体にはどのような意味があるのでしょうか？
混乱しているため、少々文章がおかしくなっているかもしれません。
意味が分かりづらい部分がありましたら、補足させていただいたいと思っています。
どうぞよろしくお願いいたします。
投稿日時 - 2008-03-13 20:41:11
> 実際にwidth border cellpadding cellspacingの属性がいまだに非推奨になっていないようですし、ちょっと不安です。
borderやwidthは必要、または有る方が良いと思います。
レイアウトテーブルではなく、本来のテーブルの使い方、たとえば点数表などを、
スタイルシートを使わずに、borderなしで書いてみてください。
cellpaddingとcellspacingも必要だと判断されたからでしょう。
> ☆ HTMLの<table>に対するborder属性、width属性、cellspacing属性、cellpadding属性は使用するべきなのか？
スタイルシート未対応ブラウザ、または未使用設定で見る時（があるのかどうか知りませんが）を考えれば、必要だと思います。
> tableに上と左のボーダー、tdに右と下のボーダーと指定すること自体にはどのような意味があるのでしょうか？
テーブルの一番外の線だけ別の色やスタイルにしているとか、そういうことはないでしょうか？
*{margin:0;padding:0}
table{
border:1px solid blue;
border-collapse:collapse;
border-spacing:0;
}
td{
border: 1px solid red;
}
<table>
<tbody>
<tr><td>1-1</td><td>1-2</td></tr>
<tr><td>2-1</td><td>2-2</td></tr>
</tbody>
</table>
たぶん、<table>のborderの上に<td>のborderが重なってしまうと思います。
とはいえ、おなじデザインでも、書き方は作り手によって様々な方法があるので、
自分が作りやすい作り方をすればいいと思います。
table{
border:1px solid blue;
}
td{
border-top:1px solid red;
border-left:1px solid red;
}
tr:first-child td{
border-top:0 none;
}
td:first-child{
border-left:0 none;
}
だったかな？(^^;
こういう方法もあります。（:first-child対応ブラウザのみ）
投稿日時 - 2008-03-14 15:17:18
お礼
ありがとうございます。
上記のコードでは、IE6だと外枠が青、FF2だと外枠が赤になりました。
このあたりもブラウザの解釈の問題なんでしょうか。
いつもその辺に悩まされます。
＞スタイルシート未対応ブラウザ、または未使用設定で見る時（があるのかどうか知りませんが）を考えれば、必要だと思います。
なるほど、そうですよね。
どうもCSSを勉強していると、HTMLでの装飾が悪いことみたいに思えてくる変な錯覚に陥ります。
かなりすっきりしました。
ありがとうございました。
投稿日時 - 2008-03-14 17:50:35
0人が「このQ&Aが役に立った」と投票しています
