締切済み

●tableをCSSで書き直すには(HTMLソース付き)

2008/11/15 09:23

いつも勉強させていただいております。今回は質問をさせていただけないでしょうか。上の表の枠のように少し立体感があるようにしたいと思います。これを、CSSにしたいのですが、border-styleをいろいろ試しても同じようになりません。どのようにすれば良いでしょうか？ <html> <STYLE TYPE="text/css">  </STYLE> <body bgcolor="#FF88FF"> <table width="270" border="1" cellpadding="0" cellspacing="0" > <tr> <td>こんな感じにしたいです。</td> <td>BBB</td> </tr> </table> <br> <table style="width:270px;" class="TTT"> <tr class="TTT"> <td class="TTT">なぜか、こんな感じになってしまいます。</td> <td class="TTT">DDD</td> </tr> </table> <br> </body> </html>

yuka_102
お礼率0% (3/342)

HTML
回答数1
ありがとう数1

みんなの回答 （1）
専門家の回答

みんなの回答

eri_610
ベストアンサー率40% (2/5)

2008/11/15 10:35 回答No.1

具体的に直したい所を指摘されていないので、なんとも言えませんが… 普通のtableタグと同じ風にしたいのであれば、こちらではどうでしょうか。 <html> <head> <STYLE TYPE="text/css">  </STYLE> </head> <body bgcolor="#FF88FF"> <table width="270" border="1" cellpadding="0" cellspacing="0" > <tr> <td>こんな感じにしたいです。</td> <td>BBB</td> </tr> </table> <br> <table style="width:270px;" class="TTT"> <tr class="TTT"> <td class="TTT">なぜか、こんな感じになってしまいます。</td> <td class="TTT">DDD</td> </tr> </table> <br> </body> </html> おそらくwidthは270で固定なのだろうと思ったので、下のは2行に至っています。もしCSSを別ファイルで指定するなら、もう少しすっきりする書き方もありますが（CSSの方を細かく指定し、表示するページのソースをすっきりさせる）今回はソースをなるべくいじらない様にしました。CSS部分だけいじってあります。あと、headタグが抜けていたので、その追加も。私も勉強中なので、間違っているところもあるかもしれませんが＾＾；もしおかしいことがありましたら、仰ってくださいね。