人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

Webページの作り方について質問です。表を作ります(例えば9列×5000行)

この表の記述で、一番上の行において

<td width="100">(文章)</td><td width="150">(文章)</td>・・・・・・・<td width="20">(文章)</td>

のようにセルの幅を指定して配置しました。しかし、2行目以降に来る(文章)の長さによって、表の幅が異なってしまいます。これを無理やり幅を指定するためには、どうしたらいいでしょうか?


変なレイアウトになってしまって困っています。よろしくお願いします。


●質問者: ReoReo7
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:Web セル レイアウト 記述
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● kn1967
●27ポイント

一番長い(文章)に合わせられてしまいますので

(1)全ての行のタグに幅を指定する
(2)あらかじめ一番長くなる(文章)の行を探しておいて、その行のタグに幅を指定する

のいずれかになります。


しかしながら、いずれの場合もブラウザがレンダリング(HTML文書を画面に出す事)するために膨大な時間を費やす事になりますので、出来れば下記の様に最初に宣言してしまう方法をお勧めします。

この方法だとブラウザはレンダリングの最初の段階で幅等のスタイル設定を済ませてしまいますので、以後の作業を高速で処理してくれます。

<table>
 <caption>表題</caption>
 <colgroup>
 <col style="width=100">
 <col style="width=150">
 ・
 ・
 <col style="width=20">
 </colgroup>
 <thead>
 <th>見出し1</th>
 ・
 ・
 <th>見出しn</th>
 </thead>
 <tbody>
 <td>文章1</td>
 ・
 ・
 <td>文章n</td>
 </tbody>
</table>
◎質問者からの返答

なるほど。早速やってみたいと思います。ありがとうございます。


2 ● llusall
●27ポイント

いわゆるカラム落ちというものでしょうか?

こちら参考になりますでしょうか?

長?いURLによるカラム落ち、に対処する - Archiva

◎質問者からの返答

ありがとうございます。


3 ● Yota
●26ポイント

スタイルシートで指定すればいいような気がしますが。

<head>

<style type="text/css">

td { width : 150px}

</style>

</head>

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ