ハマっている「お菓子」を教えて！

Tableの途中にスペースを入れたい。

解決済

  • 質問者：evaag777
  • 質問日時：
  • 回答数：3件

Tableの途中になにもないスペース（なにもない改行みたいなの）を入れたいと思ってます。
要は全く別の２つのテーブルが離れてあるかのようなイメージで、
これを１つのテーブルIDにしたいと思ってます。

こういうことは可能でしょうか？

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (3件)

No.1ベストアンサー

  • 回答者： anmochi
  • 回答日時：

こんな感じか。

下のHTMLを一つのHTMLファイル（例えばtables.html）などとして保存し、ブラウザで開いてみてください。

<html>
<head>
<title>Input File Test</title>
<style>
table {
border-collapse: collapse;
}

table tr td {
border: black 1px solid;
}

table tr.blank td {
border: black 0px none;
}
</style>
</head>

<body>
<table>
<tr>
<td>あ</td>
<td>あ</td>
<td>あ</td>
</tr>
<tr>
<td>あ</td>
<td>あ</td>
<td>あ</td>
</tr>
<tr>
<td>あ</td>
<td>あ</td>
<td>あ</td>
</tr>
<tr class="blank" style="height: 40px;">
<td colspan="3"></td>
</tr>
<tr>
<td>あ</td>
<td>あ</td>
<td>あ</td>
</tr>
<tr>
<td>あ</td>
<td>あ</td>
<td>あ</td>
</tr>
<tr>
<td>あ</td>
<td>あ</td>
<td>あ</td>
</tr>
</table>
</body>
</html>
    • good
    • 0
    • 件
通報する
この回答へのお礼

お返事が遅くなりました。ご回答ありがとうございました。
この方法で解決しました。
他の皆さんもご回答頂きありがとうございます。

通報する
お礼日時：2013/12/15 11:46

No.3

  • 回答者： tkmojo
  • 回答日時：

無理矢理やろうとするなら、改行があるように見せたい位置のセルにclassを付けて、border等を消してheightを入力すれば見た目上は実現できるでしょう。



何故ひとつのidでやりたいかというのがよく伝わってこないのですが、
単純に二つのtableをdivか何かで囲んで、そのdivにidを付けるのではダメなんでしょうか？

この回答への補足

なぜかと言うと、行の幅が変わるのを、２つのテーブルで合わせたい（プログラムで制御したくない）というのがあります。もしかすると私の知識不足でよい方法があるのかも知れません。

補足日時：2013/12/15 11:48
通報する
    • good
    • 0
    • 件
通報する

No.2

  • 回答者： ORUKA1951
  • 回答日時：

tableが連続する場合にその間にマージンをとりたい場合は単純に


table+table{margin-top:20px;}
だけでよいです。
＞これを１つのテーブルIDにしたいと思ってます。
　IDは、ひとつの文書内にひとつしか書けません。table内にtableを入れることになります。
<table id="tableID">
　<tbody>
　　<tr>
　　　<td>
　　　　<table></table>
　　　　<table></table>
　　　</td>
　　</tr>
　</tbody>
</table>
しかし、これは文書構造上とてもおかしいです。
　そもそもidやclassは「id属性及び class属性と併用することで、文書に構造を付加するため( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )」です。デザインのためではありません。tableの場合、summary属性が必須です。(HTML5では必須ではない)から、table[summary="ナンタラの表"]{}でセレクタはかける。
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

おすすめ情報

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報