• ベストアンサー

テーブルの境界線を消したい!!

上司に言われてHTMLを作成していますが、「横に並ぶ二つのテーブルの間の境界線を消せ」とワガママ言われて困っています・・・。 プログラムの関係上、セルを結合させるといけないので、見かけ上の線だけを消したいのですが、可能なのでしょうか?? 例えば、 <TABLE BORDER=1> <TR><TD>A</TD><TD>B</TD></TR> </TABLE> という場合に、AセルとBセルの間の線だけを消すことはできますか? すみません、今日中に作れと言われているので、至急回答をいただけると助かります・・・ よろしくお願い致しますm(_ _)m

  • HTML
  • 回答数6
  • ありがとう数5

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

  • ベストアンサー
  • sight
  • ベストアンサー率53% (199/370)
回答No.5

う~ん・・・そこまで細かいとRULES属性とかでもどうにもならないと思います。 まだ、横線だけ、とかTFOOTとTBODYを区別しろ、とかなら可能ですけど、HTML的にTDでマークアップした全く同列のセルを、周りと違うものとして区別することはできません。もともとの概念的に無理だと思います。 スタイルシートを使ってもBORDERはTDがつけているわけではなくてTABLE単位でつけているので、無理でしょう。 やっぱり、「表」であるということを無視してデザインだけのためにTABLE要素を使い、 <TABLE BORDER=1> <TR><TD>あ</TD><TD>い</TD><TD>う</TD></TR> <TR><TD> <TABLE FRAME="none"> <TR><TD>A</TD><TD>B</TD> </TABLE> </TD><TD>C</TD></TR> </TABLE> とするしかないんじゃないかと思うのですが。 これだと、プログラムでの書き出し(動的なHTMLページなんでしょうね)に不都合が生じますか? #***SPAN属性などでセルをまとめるのがダメだったら、これも五十歩百歩だろうなぁ・・・。

dongurineko
質問者

お礼

ありがとうございます! span属性なしで、という条件をクリアしているので、これでもう少し調整すれば行けるかもしれません。 だいぶ形が整ってきたので、何とかなりそうです。 ありがとうございました!!

その他の回答 (5)

回答No.6

う~ん、ネスケ4.Xでダメっすねぇ…。 <HTML><HEAD> <TITLE>test</TITLE> <STYLE TYPE="text/css"> <!-- TD { border-style: double; } TD.left { border-style: double none double double; } TD.right { border-style: double double double none; } --> </STYLE></HEAD> <BODY> <TABLE cellspacing="0"> <TR> <TD class="left">あ</TD> <TD class="right">い</TD> <TD>う</TD> </TR> <TR> <TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> </TABLE> </BODY></HTML>

dongurineko
質問者

お礼

ありがとうございます!お礼が遅くなりまして申し訳ありません・・・ だいぶ出来てきました。 皆さまのアドバイスのお蔭です!! ありがとうございました!!

  • sesame
  • ベストアンサー率49% (1127/2292)
回答No.4

sightさんの回答とお礼、拝見しました。 つまりはこんな感じでいいでしょうか? <TABLE BORDER=1> <TR><TD>あ</TD><TD>い</TD><TD>う</TD></TR> <TR><TD colspan=2> <TABLE BORDER=0> <TR><TD>A</TD><TD>B</TD><TR> </TABLE> </TD><TD>C</TD></TR> </TABLE> </P>

dongurineko
質問者

お礼

何度もありがとうございます。 だいぶ近づいてきました!! ただ、下にも書きましたがcolspanがどのあたりまで使っていいのかが私自身よく分かっていないので、上司に相談してみます。 でも、なんとなく行けそうになってきました・・・!!

  • a-kuma
  • ベストアンサー率50% (1122/2211)
回答No.3

<TD> タグの colspan 属性を使うとできます。こんな感じ。 <TABLE BORDER=1> <TR><TD>あ</TD><TD>い</TD><TD>う</TD></TR> <TR><TD colspan=2>AB</TD><TD>C</TD></TR> </TABLE> 二つのセルを一緒にする、というよりも、このセルは二つ分の列を使うんだ、 という指定になります。 因みに、行(縦)方向につなげるには、rowspan 属性を使います。こんな感じ。 <TABLE BORDER=1> <TR><TD rowspan=2>あ<br>A</TD><TD>い</TD><TD>う</TD></TR> <TR><TD>B</TD><TD>C</TD></TR> </TABLE>

dongurineko
質問者

お礼

ありがとうございます。 見た目はほぼ理想どおりなのですが、colspanを使うとプログラム上支障が出る、とのことで却下されました・・・(泣) 私自身、プログラムとの連携をよく理解していないので上手くご説明できなくて・・・ ご回答ありがとうございました。

  • sight
  • ベストアンサー率53% (199/370)
回答No.2

外枠を消さずに、内枠だけ消したい、ということですよね? Ineternet Explorerならば内枠のボーダーの表示をコントロールするRULES属性が効くので、 <TABLE FRAME="box" RULES="none" BORDER="1"> でいけるんですが、Netscape4.xではうまくいかないです。 一番確実なのは、 <TABLE BORDER=1> <TR><TD> <TABLE FRAME="none"> <TR><TD>A</TD><TD>B</TD></TR> </TABLE> </TD></TR> </TABLE> みたいな感じにするしかないんじゃないですかね。 外側のテーブルは外枠表示専用、セル一つにしてしまって。

dongurineko
質問者

お礼

ありがとうございます。 またまた私の説明不足でして、実際は <TABLE BORDER=1> <TR><TD>あ</TD><TD>い</TD><TD>う</TD></TR> <TR><TD>A</TD><TD>B</TD><TD>C</TD></TR> </TABLE> のようにいくつか並んだセルの、AとBの間だけを消す、というものなんです・・・。("B"と"C"の間や、"あ"と"A"の間はそのままで) すみません。。。説明が全然足りてなくて・・・ちょっと慌ててたもので・・・ 教えていただいた方法で応用できないか試してみましたが、上手くいきませんでした・・・すみません・・・。

  • sesame
  • ベストアンサー率49% (1127/2292)
回答No.1

<TABLE BORDER=1> ↑これを <TABLE BORDER=0> のようにすればOK. ただこうするとAとBのセルがくっついてしまうので、間に余白を空けたければ、 <TABLE BORDER=0 CELLSPACING=1> としてやればOKです。

dongurineko
質問者

補足

ありがとうございます。 すみません、説明不足でした・・・。 周りの線(テーブルの枠線)はそのままで、AとBの間の線のみを消したいのです・・・。こういうことはできるのでしょうか・・・???

関連するQ&A

  • テーブルのセルの高さ

    テーブルのセルの高さを設定するには、HEIGHT=で設定すればいいと思うのですが、 たとえば、わかりやすい例でいうと、 <HTML> <BODY> <TABLE BORDER=1> <TR><TD VALIGN="top">セルA</TD> <TD VALIGN="top" ROWSPAN="2"> <TABLE BORDER=1> <TR><TD>セルB-1</TD><TD>セルB-2</TD></TR> <TR><TD>セルB-3</TD><TD>セルB-4</TD></TR> <TR><TD>セルB-5</TD><TD>セルB-6</TD></TR> <TR><TD>セルB-7</TD><TD>セルB-8</TD></TR> <TR><TD>セルB-9</TD><TD>セルB-10</TD></TR> <TR><TD>セルB-11</TD><TD>セルB-12</TD></TR> <TR><TD>セルB-13</TD><TD>セルB-14</TD></TR> </TABLE> </TD></TR> <TD VALIGN="top">セルC</TD></TR> </TABLE> </BODY> </HTML> というテーブルの場合、セルAとセルCの境界はセルBの高さの真中くらいに なると思います。 それで、セルAとセルCの内容は固定なのですが、セルB内のテーブルはcgiからの 書き出しで可変長です。 実現したいことは、セルBの大きさにかかわらず、セルAの高さを固定したいのです。 セルCはセルBの高さと連動して可変するようにテーブルを組みたいのですが、 どのように指定すれば実現できるでしょうか? セルAにHEIGHT指定してもなぜか、無視(?)されてしまいます・・・ よろしくお願いします。

  • テーブルをテーブルで囲う意味はありますか?

    <table border=1> <tr><td> <table border=1> <tr><td> a </td><td> b </td></tr> </table> </td> </tr> </table> このようにテーブルをテーブルで囲う意味はありますか? htmlの勉強をしていて、 ネット上でテーブルのサンプルを拾ったのですが、 上記のようにテーブルをテーブルで囲んでました。 この方法でサイト上に100個くらいテーブルを作ってしまったのですが 今更ながらこういう書き方に意味はあるのかな? と思い始めてきました。 意味はあるのでしょうか?

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

    HTMLのテーブルについて 今、HTMLを勉強しています。下記のようにテーブルを作成し一部にセルの結合を行ったところ、(2)の結合したセル右端から外枠までが広がってしまいます。せっかく綺麗に見えるように上の表と下の表のセル幅を合わせても、上の表の右端が出っ張ってしまって意味がありません。 これを解決するにはどのように改善すればいいのでしょうか? <html> <head> <title>A</title> </head> <body> <table border="2"> <tr> <th>No.</th> <th>名前</th> <th width="50">備考</th> </tr> <tr> <td>1</td> <td>A君</td> <td>(1)</td> </tr> <tr> <td>1</td> <td>B君</td> <td rowspan="2">(2)</td> </tr> <tr> <td>1</td> <td>C君</td> <td></td> </tr> </table> <br> <table border="2"> <tr> <th>No.</th> <th>名前</th> <th width="50">備考</th> </tr> <tr> <td>2</td> <td>D君</td> <td>(3)</td> </tr> <tr> <td>2</td> <td>E君</td> <td>(4)</td> </tr> <tr> <td>2</td> <td>F君</td> <td>(5)</td> </tr> </table> </body> </html>

  • テーブルの線の幅を一重の線にしたい

    <HTML DIR=LTR> <HEAD> </HEAD> <BODY> <TABLE border=1 bordercolor="#808080"> <TR> <TH>タイトル</TH> </TR> <TD>aaa</TD> </TR> <TR> <TD>bbb</TD> </TR> <TR> <TD>ccc</TD> </TR></TABLE> </BODY> </HTML> これにすると画像のように線の幅が二重線になってしまうのですが、 一重にするにはどうすればいいですか? <TABLE border=1 を<TABLE border=0にすると、線が消えてしまいます。

    • ベストアンサー
    • HTML
  • EXCELのセル内にHTMLタグを含む文を入力

    エディタ上の文章 abc<table border=1><tr><td>A</td><td>B</td></tr><tr><td>C</td><td>D</td></tr></table> の文章をcopyして、適当なセルにpasteすると、この文章のままではなくて、A、B、C、Dが違う セルに入ってしまいます。 <とtabelの間に半角をいれて abc< table border=1><tr><td>A</td><td>B</td></tr><tr><td>C</td><td>D</td></tr></table> をcopyして、セルに入力すると、そのセル内には入りますが、abc< table border=1>ABCD とタグが無視された形で入力されてしまいます。 今まではこんな事はなかったのですが、HTMLタグが消えないようにする事はできないでしょうか?

  • テーブルが一行下がる・・・

    HTMLを作成していて、横一列に並べたいのに何故か一行下がってしまいます。 具体的には、 <TABLE width="50" border=1 align=left> <TBODY> <TR><TD noWrap align=middle>項目A</TD> <TR><TD noWrap align=middle Height=80><BR></TD></TR> </TBODY> </TABLE> <TABLE width="20" border=1 align=middle> <TBODY> <TR><TD noWrap align=middle>タイトル</TD></TR> </TBODY> </TABLE> <TABLE width="50" border=1 align=right> <TBODY> <TR><TD noWrap align=middle>項目B</TD></TR> <TR><TD noWrap align=middle Height=80><BR></TD></TR> </TBODY> というソースで、「項目A」→「タイトル」→「項目B」と横一線に並べたいのですが、何故か「項目B」が一行下がって表示されます・・・ HTMLを作るのは初めてで、色々と調べたのですがよく分かりませんでした・・・。 どなたか助けてください!! よろしくお願い致しますm(_ _)m

    • ベストアンサー
    • HTML
  • DreamWeaverで作るテーブル

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>無題ドキュメント</title> </head> <body> <table width="800" height="394" border="1" align="center"> <tr> <td>  <p>1</p> <table width="200" border="1" align="left"> <tr> <td height="118">2</td> </tr> </table> <table width="600" border="1"> <tr> <td height="121">3</td> </tr> </table> <p> </p></td> </tr> </table> </body> </html> このようにテーブルを作った場合、3のセルの右のラインが1のセルの右ラインに隠れるというか見えなくなります。 そこで3のセルにalign="left"を設定するとIEではラインが見えるのですが、Netscapeでは2と3が縦に並んでしまいます。 なんとか3の右ラインを見えるようにしてNetscapeでも縦に並ばないようにするにはどうすればいいでしょう。 よろしくお願いいたします。

  • テーブルの枠が2重線になるので

    Border=1 にしてみましたが駄目でした テーブル枠を1重線にするにはどうしたらいいのでしょうか? <table border=1 cellspacing=0 cellpadding=0> <caption align=left> <nobr>あいうえおかきくけこ<nobr/> </caption> <tr><td colspan=3>abc</td></tr> <tr><td>A</td><td>B</td><td>C</td></tr> <tr><td>A</td><td>B</td><td>C</td></tr> <tr><td colspan=3 height=15></td></tr> </table>

    • ベストアンサー
    • HTML
  • 細線テーブル

    <table border=1 style="border:solid;border-width:1"> <tr><td>A<td>A <tr><td>A<td>A </table>

    • ベストアンサー
    • HTML
  • 特定のテーブルのみ枠線の色を消したい

    スタイルシートで他のテーブルの為に色を設定しているけど 特定のテーブルのみ、枠線の色をすべて消したい場合は、 どうすればよろしいでしょうか? <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