セルタグで分け方を変えたいです

質問

• FC2ブログを運営している私はセル用のタグを使用したいです。現在のタグは枠が付かない設定ですが、今回枠を付ける必要が出てきました。セルの感覚が等間隔ではない状態が必要です。
• 表現が見つからず、名前の文字を並べたタグを使用しました。上の段は左右にセルの枠を挟んで８文字ずつの短文が作られており、その下には左２つが４文字ずつの短文、右２つが２文字ずつの短文があります。セルの縦や横の枠の位置を自由に変えられるタグが知りたいです。
• 現在使用しているタグを変更するのは大変であり、他に良い方法があるか質問しています。詳細なタグ情報はtagindex.comのページを参考にしています。

回答No.5

syagain · ベストアンサー

再び失礼します。すみません、回答内容がずれていたようですね。
つまり上部のタグをいじらずに、
[見出し][解説][見出し][解説]（横並びに四列でいいんでしょうか？）

下部を、上部と横幅を揃えたい、という感じでしょうか。
[見出し][画像][画像][画像]

（１）
<table>自体を分ける、という手段があると思います。
その上でテーブル幅を固定すれば、どんなに横のセル数（列数）が違っても、テーブルの横幅自体はぴったり一致します。

まずスタイルシートでテーブルの横幅を固定します。
例1）スタイルシート.cssを用意する
table{table-layout:fixed;width:80%;}

例2）ページのヘッダーに書き込む。
<style TYPE="text/css">
<!--
table{table-layout:fixed;width:80%;}
-->
</style>

そして既にあるテーブルの下に、見出し+画像のテーブルを置きます。
テーブルの横幅は上記のスタイルシートによって、揃えられます。
[名前th　][名前　　][名前th　][名前　　]（元のテーブル）
[見出し　][画像　　][画像　　][画像　　]（下に作るテーブル）

或いはこんな風にもできる筈です。
[名前th][名前　　　　　 ][名前th][名前　　 　　　]（元のテーブル）
[見出し][画像][画像][画像][見出し][画像][画像][画像]（下に作るテーブル）

<table border=5>
<tr>
<th>名前</th><td>名前</td>
<th>名前</th><td>名前</td>
</tr>
</table>

<table border=5>
<tr>
<th>見出</th>
<td>画像</td>
<td>画像</td>
<td>画像</td>
</tr>
</table>

画像の列数を付け加えても、<table>の横幅は同じになる筈です。
（ただしwidth:◯◯;で設定したサイズに収まる程度で）

（２）
１つのテーブルに収める場合、やはり列数、<td>の数を上と揃えるのが一番だと思います。
下の[画像セル]を一つだけ用意して、下のセルにcolspanを設定してはいかがでしょうか。画像自体は一つのセルに横並びさせることができると思います。
<table border=5>
<tr>
<th>名前</th><td>名前</td>
<th>名前</th><td>名前</td>
</tr>

<tr>
<th>見出</th>
<td colspan="3"><img><img><img></td>
</tr>
</table>

[名前][名前][名前][名前]
[見出][画像／画像／画像]
こんな表になると思います。

或いは上部が[見出し][解説]の二列であれば、
colspanを設定しなければ、そのまま下記の表ができます。

[名前][名前　　　　　　]
[見出][画像／画像／画像]

こんな感じではいかがでしょうか？　また違ってたら済みません。

お礼

遅くなりましたが
どうも有難う御座います