- 題名: テーブルの整形
- 日時: 2012/02/15 16:11:16
- ID: 29864
- この記事の返信元:
- (なし)
- この記事への返信:
- [29871] Re[1]: テーブルの整形2012/02/15 23:00:58
- ツリーを表示
■No29864に返信(はまさんの記事)
colタグやcolgroupタグを利用されてはいかがでしょうか。
ブラウザの画面に出力されたものを画像で添付してみました。
期待されているのはこんな感じのものですか?
<html>
<head>
<style type="text/css">
table {
table-layout:fixed;
border:solid 1px black;
width:15em;
}
td {
border:solid 1px gray;
}
.col1, .col2 {
width:33%;
}
.col1 {
background-color:pink;
}
.col2 {
background-color:skyblue;
}
.col3 {
background-color:lightgreen;
}
</style>
</head>
<body>
<table>
<col class="col1" />
<col class="col2" />
<col class="col3" />
<tr>
<td colspan="2">hoge</td>
<td>fuga</td>
</tr>
<tr>
<td>hoge</td>
<td colspan="2">fuga</td>
</tr>
</table>
</body>
</html>
分類:[ASP.NET]
2012/02/15(Wed) 18:57:21 編集(投稿者)
お世話になってます。
テーブルの整形で質問させてください。
1行目は左に大きなスペースがあり、
2行目は右に大きなスペースがあるテーブルを作成したいのですが、うまくいきません。
試したのは以下の通りです。
1.colspanして、疑似3列にならないか。
<table>
<tr>
<td colspan="2"></td>
<td></td>
</tr>
<tr>
<td></td>
<td colspan="2"></td>
</tr>
</table>
-> 2列のまま。
2.もう1行足して、その行は見えなくする。
<table>
<tr>
<td colspan="2"></td>
<td></td>
</tr>
<tr>
<td></td>
<td colspan="2"></td>
</tr>
<tr>
<td height="0"/>
<td />
<td />
</tr>
</table>
-> 上2行は期待通りの形になりますが、最終行が消えません。
お知恵を貸していただけませんか?
宜しくお願いいたします。