ベストアンサー

テーブルにスクロールバーを付ける方法を教えて下さい。

2006/01/13 21:06

今HPを作ってまして分からない事だらけなのでお知りな方力をお貸し下さい。セル内に文を書いてるのですが間延びするのが嫌なのでスクロールバーをつけようかと思うのですがドリームウェーバー（MAC)でやり方を教えてください。よろしくお願い致します。その他の質問も教えて頂けるとありがたいです。

poupou
お礼率29% (63/212)

ホームページ作成ソフト
回答数3
ありがとう数0

みんなの回答 （3）
専門家の回答

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

ベストアンサー

seaw
ベストアンサー率43% (10/23)

2006/01/13 22:31 回答No.2

3o-clockさんが、overflow:scroll;でやる方法を挙げてくださっていますが。 overflow: auto;を使う方法もあります。 ※参考 http://www6.plala.or.jp/go_west/nextcss/ref/prp/dsp_n_ps/overflow.htm 一応サンプルを作っておきました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja" dir="ltr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta name="robots" content="NOINDEX, NOFOLLOW"> <style type="text/css"> body { background-color: #ffffff; color: #000000; } table.sample { background-color: #000000; border: 1px solid #000000; width: 400px; hight: 400px; } table.sample td { background-color: #ffffff; border: 0; padding: 3px; } table.sample td div { width: 200px; hight: 200px; overflow: auto; } </style> <title>サンプル</title> </head> <body> <table class="sample" cellspacing="1"> <tr> <td>AAAAAAAAAA</td> <td>BBBBBBBBBB</td> </tr> <tr> <td>CCC</td> <td> <div> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD <br> DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD </div> </td> </tr> </table> </body> </html>

その他の回答 (2)

noname#19206

2006/01/14 00:05 回答No.3

テーブルの中身をスクロールさせるのは、確か環境によって認識状態がかなり変わったと思います。 IEにはコレに関するバグがあるとも解説書で読みました（ややうろ覚え）テーブルの外側からスクロールさせることをお勧めします。あと、#1 3o-clockさんが提示されているリンク先のソースだと、非IE環境で派手に表示が崩れます…。（HTMLの仕様上、本来overflowはdivやpなどブロック要素にしか適用できない。） ↓こんな感じで…。 <div style="width:400px;overflow:auto;"> <table border width="800"> <tr> <td>AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA </td> <td>AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA </td> </tr> <tr> <td>AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA </td> <td>AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA <BR> AAAAAAAAAA AAAAAAAAAA AAAAAAAAAA </td> </tr></table>