• ベストアンサー

ホームページの表の作成について…

ホームページで、表を作る段階で今悩んでいます。 <table border="1" cellspacing="0"style="border-width:1" bordercolor="#000000" background="http://radiowind.web.fc2.com/backgroundtable" style="border-style:solid"> <tr> <td>あいうえお</td><td>かきくけこ</td> </tr> <tr> <td>さしすせそ</td><td>たちつてと</td> </tr> </table> http://radiowind.web.fc2.com/test1.html で作成したんですが、どうしても表の枠がそれ以上細くなりません。 表の行は、もっと足すつもりです。 このタグをなるべく使って、細くできるでしょうか。 下の表の枠ぐらいの細さがいいです。 http://radiowind.web.fc2.com/test2.html 教えて下さい。

noname#90152
noname#90152

質問者が選んだベストアンサー

  • ベストアンサー
noname#105044
noname#105044
回答No.1

こんなのはダメでしょうか？ <table bgcolor="#000000" cellspacing="1"> <tr> <td bgcolor="#ffffff">あいうえお</td><td bgcolor="#ffffff">かきくけこ</td> </tr> <tr> <td bgcolor="#ffffff">さしすせそ</td><td bgcolor="#ffffff">たちつてと</td> </tr> </table> 枠線の表示は０にしてしまって、テーブル背景を黒にして セル背景を白にすると、テーブル自体の背景色とセルの隙間が 細い枠線のようになります。 背景は画像でも大丈夫です。

noname#90152
質問者

お礼

教えて頂き、ありがとうございます。 早速ホームページに利用してみたいと思います。

その他の回答 (1)

  • torayoshi
  • ベストアンサー率62% (910/1449)
回答No.2

セルとセルの罫線がダブってるから太くなってしまいます。 あくまでこのタグを使いたいってんならこんなふうにしてみるとか↓ <table border="1" cellspacing="0" style="border-width:0;" bordercolor="#000000" background="http://radiowind.web.fc2.com/backgroundtable" style="border-style:solid; border-collapse:collapse;"> <tr> <td>あいうえお</td><td>かきくけこ</td> </tr> <tr> <td>さしすせそ</td><td>たちつてと</td> </tr> </table> ただし、これはIEだけでFirefoxだとうまく行かないみたい。 FirefoxはCSSの解釈がより厳格だからでしょうね。 理由は、セル(td)罫線の太さ指定はあくまで<td>に指定すべきです。 上記タグはtableにしか適用されてません。 だから細くならないんです。 私ならこうします。 <html> <head> <title></title> <style type="text/css"><!-- table { border-collapse:collapse;} td { padding: 2px;border: 1px solid #000000; } --></style> </head> <body> <table background="http://radiowind.web.fc2.com/backgroundtable"> <tr> <td>あいうえお</td> <td>かきくけこ</td> </tr> <tr> <td>さしすせそ</td> <td>たちつてと</td> </tr> </table> </body> </html>

noname#90152
質問者

お礼

教えて頂き、ありがとうございます。 早速ホームページに利用してみたいと思います。

  1. カテゴリ
  2. インターネット・Webサービス
  3. その他（インターネット・Webサービス）

関連するQ&A

  • ホームページの表の作成について２…

    前回、『ホームページの表の作成について…』という質問をしました。 そして、 <table bgcolor="#000000" cellspacing="1" background="http://radiowind.web.fc2.com/backgroundtable"> <tr> <td bgcolor="#ffffff">あいうえお</td><td bgcolor="#ffffff">かきくけこ</td> </tr> <tr> <td bgcolor="#ffffff">さしすせそ</td><td bgcolor="#ffffff">たちつてと</td> </tr> </table> にしました。 でも、表の背景が表示されません。 どこが間違っているんでしょうか？

  • 特定のテーブルのみ枠線の色を消したい

    スタイルシートで他のテーブルの為に色を設定しているけど 特定のテーブルのみ、枠線の色をすべて消したい場合は、 どうすればよろしいでしょうか？ <style type="text/css"> table {border:1px solid red;} table tr {border:1px solid red;} table th {border:1px solid red;} table td {border:1px solid red;} </style> <body> <table border=1 cellspacing=1 cellpadding=1> <tr><td>a</td><td>b</td></tr> </table> <br> <table border=1 cellspacing=1 cellpadding=1 bordercolor="FFFFFF"> <tr><td>a</td><td>b</td></tr> </table> <br> <table border=0 cellspacing=0 cellpadding=1 bordercolor="FFFFFF"> <tr><td>a</td><td>b</td></tr> </table> <br> <table cellpadding=1 bordercolor="FFFFFF"> <tr><td>a</td><td>b</td></tr> </table> <br> <table bordercolor="FFFFFF"> <tr><td>a</td><td>b</td></tr> </table> このソースだと、テーブルならすべて枠線が付いてしまいます。 特定のテーブルのみ赤枠ではなく、白にして色を消したいのですがどうすればいいですか？

    • ベストアンサー
    • CSS
  • borderとcellspacingの違い

    <table border=0 bordercolor="#ff0000"> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> <table border=1 bordercolor="#ff0000"> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> <table cellspacing=0 bordercolor="#ff0000"> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> <table cellspacing=1 bordercolor="#ff0000"> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> <table border=1 cellspacing=1 bordercolor="#ff0000"> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> <table border=1 cellspacing=0 bordercolor="#ff0000"> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> いろいろサンプルを作ってみたのですが、 結局borderとcellspacingは、どう違うのでしょうか？

    • ベストアンサー
    • HTML
  • 表の作成をスタイルシートで

    皆さんはHTMLで表を作成する際、どのように作成していますか？ 私はTableタグとスタイルシートを使っているのですが、これをスタイルシートのみで 作成できないでしょうか。 例えば以下のような表で、■部分は他のセルと背景色を変えます。 　　　■□□ 　　　■□□ 　　　■□□ 通常私がやっている方法は、tableタグに下記スタイル「tb01」を、タイトル部分には 「td.title」を設定を設定しています。 -----------------HTML-------------------------- <table width="100%" border="0" cellspacing="1" cellpadding="0"> 　<tr> 　　<td class="title">6月7日</td> 　　<td>text</td> <td>text</td> <td>text</td> 　</tr> 　<tr> 　　<td class="title">6月8日</td> 　　<td>text</td> <td>text</td> <td>text</td> 　</tr> </table> ---------------------------------------------------------- -----------------スタイルシート-------------------------- .tb01　{FONT-SIZE: 12px; border-collapse : collapse ; 　　　　border-width : 1px 0 0 1px ; border-style : solid ; 　　　　border-color : #CDCDCD ; ; width:350px; background-color:#FFFFFF; 　　　　} table.tb01 td　{border-width : 0 1px 1px 0 ; border-style : solid ; padding : 7px ; 　　　　　　　　line-height:120%; border-color : #CDCDCD ; } td.title　{background-color:#ECECEC; 　　　　　} ---------------------------------------------------------- スタイルシートのみでは無理でも、もっと良い方法があれば 是非教えてください。

    • ベストアンサー
    • HTML
  • テーブル（表）の表示について

    ブラウザ（現在わかっているのはIE6、7）によって、表の表示が異なる事に悩んでます。 例えば、 <table cellpadding="5" style="border-collapse:collapse;font-size:12px;color:#000000;background:#B2DFEE;text-align:left;margin:15px 15px 15px 15px ; float: left;"><tbody><tr> <td style="border:1px solid #000000" colspan="5"><div align="center"><b>○○</b></div></td> </tr><tr> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○</td> </tr><tr> <td style="border:1px solid #000000">○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○</td> </tr><tr> <td style="border:1px solid #000000">○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○</td> </tr><tr> <td style="border:1px solid #000000">○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○</td> </tr><tr> <td style="border:1px solid #000000">○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○</td> </tr><tr> <td style="border:1px solid #000000">○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○</td> </tr><tr> <td style="border:1px solid #000000">○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○○○</td> <td style="border:1px solid #000000">○○</td> </tr></tbody></table> のような記述だと、右側の罫線が表示されません。 私はFirefoxを使っていて安心していたのですが、友人に指摘されて困っています。 作成した環境はwin xp MCE 2002 sp3です。 ちなみにSafariではきちんと表示されていました。 どこを直せばいいのかどなたか教えてください。 宜しくお願い致します。

    • ベストアンサー
    • HTML
  • TABLE（表）を横に並べたいのですが

    こういった表↓（実際はもっと縦が長いです）をhtmlで少し間隔をあけて横に並べて表示したいのですが、どのようにすればいいのでしょうか？可能なのでしょうか？ 宜しくお願い致します。 <table cellpadding="5" style="border-collapse:collapse;font-size:12px;color:#000000;background:#ffffff;text-align:center"><tbody><tr> <td style="border:1px solid #ffcccc" colspan="3">ここに文字</td> </tr><tr> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> </tr><tr> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> </tr><tr> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> </tr><tr> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> <td style="border:1px solid #ffcccc">ここに文字</td> </tr></tbody></table>

    • ベストアンサー
    • HTML
  • テーブルの線の色が指定できない

    テーブルの線の色が指定できないうえ、最後に宣言したスタイルシートが適用されてしまいます。 理由がわかりません。 <style type="text/css"> table, td, th.bordercolor_white { border: 1px white solid; } table, td, th.bordercolor_red { border: 1px red solid; } </style> <table class="bordercolor_white"> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> このような文だと、 <table class="bordercolor_white">としているのに、 なぜかテーブルの線の色は、赤になってしまいます。 table, td, th.bordercolor_red { border: 1px red solid; } table, td, th.bordercolor_white { border: 1px white solid; } のように、順番を入れ替えると、最後に宣言した白になります。 なので、<table class="bordercolor_white">の部分は無視されるようです。 二つのテーブルの線の色を用意した場合、 任意でテーブルの線の色を付ける方法をご教授ください。

    • 締切済み
    • CSS
  • PHPファイルの画像背景について

    PHPファイルでお問い合わせフォームを作りました。 画像背景を入れたいのですが なかなかうまくいきません。 スタイルは共通で以下ファイルを作りました。 <?php //style2.phpで書換え可能とする //背景色 $bgcolor = "#FFFFFF"; //文字色 $textcolor = "#999999"; //リンク色 $linkcolor = "#BC8F8F"; //訪問済リンク色 $vlinkcolor = "#cccccc"; //選択時リンク色 $alinkcolor = "#a48b82"; //フッター文字 $footertext = "(C)○○○○"; //水平線の色 $hrcolor = "#cccccc"; //枠の色(主にPC向け) $bordercolor = "#cccccc"; $style = array( "BODY"=>"<BODY bgcolor=$bgcolor text=$textcolor link=$linkcolor vlink=$vlinkcolor alink=$alinkcolor>" ,"FOOT"=>"<center>$footertext</center>" ,"HR"=>"<HR size=1 color=$hrcolor>" ,"TABLE_S"=>"<table border=1 align=center cellpadding=4 bordercolor=$bordercolor width=240 cellspacing=0><tr><td>" ,"TABLE_E"=>"</TD></TR></TABLE>" ,"TABLE_S2"=>"<table border=1 align=center cellpadding=4 bordercolor=$bordercolor width=480 cellspacing=0><tr><td>" ,"TABLE_S3"=>"<table border=1 align=center cellpadding=4 bordercolor=$bordercolor width=750 cellspacing=0><tr><td>" ); ?> お気づきの点がありましたらよろしくお願いします。

    • 締切済み
    • PHP
  • テーブル・セル枠線の色

    下記のようにテーブルを組むと、IEでは1pxの赤いボーダーで表示されるのですが、 ネスケだとグレーの太い線になってしまいます。 どのように変えたらよいのでしょうか。 <TABLE border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#FF5F8D" width="100%"> <TR> <TD width="50%">　</TD> <TD width="50%">　</TD> </TR> </TABLE>

    • ベストアンサー
    • HTML
  • スタイルシートをhead内で定義したい

    下のテーブルのようにしたいんですが、上のテーブルはすきまができています。 このすきまをなくすために、<STYLE>の中を修正してください。 <TABLE>内は変更せずに<STYLE>だけでできるはずです。 <HTML> <HEAD> <STYLE> table.ccc{border:solid;border-color:#bbbbcc} td.ccc{border:solid;border-color:#bbccbb} .ccc th{border:solid;border-color:#ccbbbb} </STYLE> </HEAD> <BODY> <TABLE class="ccc"> <TR class="ccc"> <TH>名前</TH> <TH>住所</TH> </TR> <TR class="ccc"> <TD class="ccc">太郎</TD> <TD class="ccc">東京都新宿区</TD> </TR> <TR class="ccc"> <TD class="ccc">花子</TD> <TD class="ccc">沖縄県那覇市</TD> </TR> </TABLE> <br> <TABLE cellspacing=0 style="border:solid 4px #ddddee"> <TR> <TH style="border:solid 4px #eedddd">名前</TH> <TH style="border:solid 4px #eedddd">住所</TH> </TR> <TR> <TD style="border:solid 4px #ddeedd">太郎</TD> <TD style="border:solid 4px #ddeedd">東京都新宿区</TD> </TR> <TR> <TD style="border:solid 4px #ddeedd">花子</TD> <TD style="border:solid 4px #ddeedd">沖縄県那覇市</TD> </TR> </TABLE> </BODY> </HTML>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する