• ベストアンサー

HTML のテーブル構造

HTML のテーブル構造で悩んでいます。 以下の図(下手ですいません)のようなテーブルを作成したいのですが 現実的に可能なのでしょうか? もし、わかる方がおられましたら、ご享受をお願いいたします。 (縦と横がつながる感じで * には文字をいれたい) -------| |*******| |*|-----| |*|*****| |*|-----| |*|*****| -------|

  • ukatu
  • お礼率41% (15/36)
  • HTML
  • 回答数7
  • ありがとう数3

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

  • ベストアンサー
  • moon
  • ベストアンサー率28% (19/67)
回答No.4

少しご希望の形と違うとは思いますが、このような形ではいかがでしょうか? <table border="1" cellspacing="0" cellpadding="0"> <tr><td><table border="0" cellpadding="0"><tr><td colspan="2">あああ</td></tr> <tr><td width="10">いい</td><td align="right" valign="bottom"> <table border="1" cellpadding="0"><tr><td>ううう</td></tr> <tr><td>えええ</td></tr></table></td></tr></table></td></tr></table> (見た目が整理されていなくてすみません)

ukatu
質問者

お礼

すごく、近いと思います。ありがとうございます。 すこし、これをもとにがんばってみようと思います。

その他の回答 (6)

  • naoto0314
  • ベストアンサー率34% (25/73)
回答No.7

出来ないというのは実際にセルが縦と横につながるということですが、見た目上のukatuさんの意図した物はmoonさんのタグでいいかと思います。

  • naoto0314
  • ベストアンサー率34% (25/73)
回答No.6

TEBLEタグは本来、表を作るタグなので縦と横がつながることはできません。 また、縦と横がつながったところで文字の表示もおかしくなります(縦書きか横書きかわからない為)。

  • SpiceGirl
  • ベストアンサー率69% (493/713)
回答No.5

こんばんは。 -------| テーブルの線とのことですが、左側に線がないのが理解できていないのですが <table width="100%" border="0"> <tr> <td colspan="2">&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td><table width="100%" border="0"> <tr> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> </tr> </table></td> </tr> </table> それから、 >うまくいきませんでした。 ではどこがどう違うのかご指摘していただかないと、最良な回答が頂けないと思います。

ukatu
質問者

お礼

不備な点がたくさんあり、大変申し訳ないです。

  • ittochan
  • ベストアンサー率64% (2667/4137)
回答No.3

こんな感じ? <table border="1" width="326" height="152"> <tr> <td width="156" height="66"></td> <td width="154" height="152" rowspan="2">あ<br> い<br> う</td> </tr> <tr> <td width="156" height="74"></td> </tr> </table>

ukatu
質問者

補足

サンプルまで書いていただいてありがとうございます。 しかし、うまくいきませんでした。 また、よい方法あればお願いします

  • vnsolong
  • ベストアンサー率25% (5/20)
回答No.2

colspan とrowspanを同時に使うイメージですよね? 1つのテーブルの中に 一行目用テーブル(カラムが1つだけ)と 二行目以下用のテーブル(1列目はrowspan)を作成して、 一番外側のcellspacing=0にすれば見た目上は 上記のようになると思います。 一つのテーブルだと実現は難しいような。

  • SpiceGirl
  • ベストアンサー率69% (493/713)
回答No.1

こんにちは。 出来ると思いますが、一番上と一番下の -------| が何を意味するのか補足いただけますでしょうか。

ukatu
質問者

補足

テーブルの線になります。

関連するQ&A

  • HTMLでテーブルを表示させようとしています。

    HTMLでテーブルを表示させようとしています。 画像のような勤務状況がわかるテーブルをHTMLで表示させようとしています。 テーブルの数字項目は時刻を表しています。(9から18まであります) ブラウザの横スクロールは表示させたくないので テーブル内の一部項目(「No.」から「氏名」まで)を固定にして 横スクロールバーを表示させたいのです。 縦スクロールのサンプルを見つけ、 これを横に対応させればよいかと思ったのですが うまく表示させることが出来ませんでした。 一部項目を固定にして横スクロールバーを表示することは可能なのでしょうか?

    • ベストアンサー
    • HTML
  • HTML タグ(ブログ作成)

    ブログを作成したいのですが TOP画面を大きくフリーページを使い 縦長に3つテーブルといえばよいのでしょうか? 幅を決めて 画像や文字をずっと下に入れていきたいのですが・・ どうやって HTMLタグを使用して区切ればよいのでしょうか? ちなみに区切る線は表示したくありません。 ------│-------│--------│  画像 │ 文字 │ 画像    │  文字 │ 画像 │ 文字   │ ※ブログは楽天を使用したいと思います。  ↑図が下手で申し訳ありません。

  • テーブルの隙間を無くしたい

    DreamWeaverCS4を使いホームページを作成しております。そこでテーブルについて、狙い通りに上手く表示が出来なくて困っております。どなたかご指導アドバイスをお願い致します。具体的な内容は下記のとおりです。 ・テーブルを「7列2行(全体の大きさは横700px×縦100px)」で作成し、内訳は1行目は、一枠横100px×縦50pxの大きさで7枠作成。2行目は横700px×50pxで作成。 上記内容のテーブル1行目に横100px×縦50pxのサイズの画像を7つ挿入。そして2行目には横700px×縦50pxの画像を1つ挿入しました。 そしてテーブルの設定は「ボーダーは0」です。 しかし、画像挿入後には2行目の画像横700px×縦50pxが入っているテーブルに隙間が出来て背景が見えてしまいます。1行目を見ると…微妙に各画像間の間に隙間が空いていて、この隙間が全体的に700pxを超えているようなんです。それで、2行目の画像に対して背景が見えて(テーブルの幅が広がってしまっています)いるのです。 そこでですが、画像を配置後にテーブルの隙間をきっちりと無くして背景が見えなくする方法ってあるのでしょうか? 解る方がいましたら…ご指導…アドバイスをお願い致します…。よろしくお願い致します…。

    • ベストアンサー
    • HTML
  • HTMLのテーブル枠が印刷されない!

    タイトル通りですが、HTMLのテーブル枠を印刷したいのに、されません。どのような設定をしたら、印刷されるようになるのでしょうか? 表が印刷されずに文字しか印刷されないので、間抜けな感じになってしまいます。

  • HTMLでテーブル幅を固定しても文字が折り返せない

    HTMLのテーブル幅を文字が突き抜けて幅が広がってしまって困っています。 例としては以下のような連続した文字が入った場合です。 <table width="150"> <tr><td width="150">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaあいおえう </td></tr> </table> どなたか、適切に折り返すにはどうしたらよいかご存知の方おりましたら、おしえてください。

    • ベストアンサー
    • HTML
  • フレームなどのHTMLについて

    エディタなどを使って、HPを作成しようとしています。 自分でいろいろ配置しながらソースを確認してやってるんですが、 どうにもうまくいかないので、2つほどアドバイスお願いします。 (1)例えばテーブルを1つ作ったとして、その横に文章を書く時、テーブルの1番下のところにしか文字が書けません。 また同じようなことだと思うんですが、テーブルの横に少し間を開けてテーブルを作成しようとしても、元あったテーブルの下へ出来てしまい、横に並べて作ることが出来ません。 どうやったら作れるんでしょうか。 ソフトは「alphaEDIT+」を使用しています。 タグでもいいので教えて頂けると嬉しいです。 (2)HPのベースを作る際、この教えて!gooみたいに、横にメニューを置いて作りたいと思います。 その時、ここと同じようにメインの部分をスクロールさせた時、一緒にメニューも動くようにしたいです。(ブログによくある感じで) これがノンフレームってやつなのか^^; こういう時は、メニューとメインを別々に作ってタグかなんかでくっつけて表示させるんでしょうか? またもしそうなら、普通のフレームで作ったのと同じように、各ページを表示させる時「target」とかで表示させる場所をメインの部分にしておけば、メニューは自動的に表示されるんでしょうか? 初心者なので質問が意味不明かもしれませんm(__)m また、こういうHTMLが分かりやすく書いてあるようなオススメサイトがあれば教えてほしいです。 よろしくお願い致します。

  • テーブル作成について

    おはようございます。 テーブル作成の件についてお聞きしたいことがあります。 以下のような構造のテーブルを作成したいのですが table border="0" と記載しても左下のタグに枠線が 表示されてしまいます。 右下の枠線だけを表示しないことはできるのですが 左下の枠線を表示させないようにすることは できないのでしょうか? よろしくお願いいたします。 作成したい構造(1テーブル) □□   □ 

    • ベストアンサー
    • HTML
  • HTML、CSSについて。テーブル背景がズレる。

    こんにちは。よろしくお願いします。 HTMLとCSS、2つのファイルを作成しています。 HTMLでテーブルを作成し、<td><div=名前></div></td> として、テーブルの中身はCSSにまかせています。 複数列、複数行ありますがdiv名はひとつずつ違うのが付いています。 CSSでは、 div#名前 { width: 20px; height: 20px; margin: 0px; padding: 0px; background: url(画像名.gif); }   ・   ・   ・ htmlを表示させてはcssのpxを調節し、 きれいな背景画像付きのテーブルが完成した!と思ったのですが、 ブラウザの文字サイズを最大に変更すると崩れてしまいました。 pxではなくて%で指定してみても崩れます。 解決策をご存知の方、教えてくださると有難いです。 よろしくお願いします。

  • テーブルの横に文字(HP作成)

    テーブルで 小さい四角を作成して、その横に文字を入れたいのですが -----       文字 ----- こんな感じにしたいのですが、どうしたらよいでしょうか?

  • テーブルと写真を並べて表示

    HPをHTML(メモ帳)で作っています。 テーブルと写真を並べて(テーブルを左、写真を右に)表示させたいと思っています。 でも、改行も入れていないのにテーブルの下に写真がきて、縦に並んでしまいます。 無知なだけの質問かもしれませんが、どうやったらテーブルと写真を横に並べることができるのか教えてください。

    • ベストアンサー
    • HTML

専門家に質問してみよう