こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

テーブルを作ったんですが…

はじめまして
画像テーブルを作ったのですが、スクロールバーがでません。
タグを載せておきますので暇でしたら解答してください。

<style TYPE="text/css">
<!--.auto {border:solid;height:450pt;width:500pt;overflow:auto;}-->
</style>

<TABLE align="left" width="500" cellpadding="0" cellspacing="0" border="0">
<TBODY>
<TR>
<TD width="420" height="27"><IMG src="01.gif" width="42" height="27" border="0"></TD>
<TD background="02.gif"></TD>
<TD width="0" height="0"><IMG src="03.gif" width="40" height="27" border="0"></TD>
</TR>
<TR align="left">
<TD background="04.gif"></TD>
<TD width="100%" height="350" bgcolor="white"><pre>テスト<BR>
</TD>
<TD background="06.gif"></TD>
</TR>
<TR>
<TD width="416" height="25"><IMG src="07.gif" width="42" height="46" border="0"></TD>
<TD background="08.gif"></TD>
<TD width="0" height="0"><IMG src="09.gif" width="40" height="46" border="0"></TD>
</TR>
</TBODY>
</TABLE>

投稿日時 - 2005-07-28 20:13:49

QNo.1544716

暇なときに回答ください

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

質問者さんの意図がちゃんと汲み取れてなくて申しわけないのですが,例えば<img src="01.gif" width="42" height="27" border="0"> にスクロールバーをつけたければ,

<html>
<head>
<!--中略-->
<style>
<!--
.scrollImg { width: 30px; height: 20px; overflow: auto; }
-->
</style>
</head>
<body>
<!--中略-->
<div class="scrollImg"><img src="01.gif" width="42" height="27" border="0"></div>
<!--中略-->
</body>
</html>

のようにすればいいのです。
要はスクロールバーを出したい領域を上のような<div>ではさめばいいのです。
ただし,<div>の中に表のセル<td>を直接入れることはできないはずなので,こういう場合は<div>の中に<table>を入れてその中に<td>を入れるようにします。

投稿日時 - 2005-07-28 22:41:56

お礼

こんなに細かく書いていただいてありがとうございます。
本当に感謝しています!お陰でできました!!

投稿日時 - 2005-07-28 22:58:00

ANo.3

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(3)

ANo.2

<table>でなくて<img>にスクロールバーをつける場合は,<img>を<div class="...">~</div>ではさむようにし,この<div class="...">に対応するスタイルを<style>中に width:○○px;height:○○px;overflow:autoのように記述しておけばいいでしょう。

投稿日時 - 2005-07-28 21:43:48

補足

つまりこういうことですか?↓(呑みこみ遅くてすみません;)
<div class="...">の中の...には何をいれればいいんでしょうか…。
本当に何度も何度もすみません…。

<TABLE align="left" width="500" cellpadding="0" cellspacing="0" border="0">
<TBODY>
<TR>
<TD width="420" height="27"><div class="..."><IMG src="01.gif" width="42" height="27" border="0"></TD></div>
<TD background="02.gif"></TD>
<TD width="0" height="0"><div class="..."><IMG src="03.gif" width="40" height="27" border="0"></TD></div>
</TR>
<TR align="left">
<TD background="04.gif"></TD>
<TD width="100%" height="350" bgcolor="white">
テスト<BR>
</TD>
<TD background="06.gif"></TD>
</TR>
<TR>
<TD width="416" height="25"><div class="..."><IMG src="07.gif" width="42" height="46" border="0"></div></TD>
<TD background="08.gif"></TD>
<TD width="0" height="0"><div class="..."><IMG src="09.gif" width="40" height="46" border="0"></div></TD>
</TR>
</TBODY>
</TABLE>
</div>

<style TYPE="text/css">
<!--.auto {border:solid;height:450px;width:500px;overflow:auto;}-->
</style>

投稿日時 - 2005-07-28 22:08:48

ANo.1

<table>全体を<div class="auto">~</div>の中に入れてみてください。

height:450pt;width:500pt; は
height:450px;width:500px; の間違いでないでしょうか?
tableの高さ・幅が450px, 500pxを超えればスクロールバーが表示されるはずです。

投稿日時 - 2005-07-28 20:56:14

補足

アドバイスありがとうございます。
えっと…それですと外側に黒い枠ができてしまって、
そっちのテーブルの方にバーがついてしまうんです。
画像の中にスクロールバーを入れたいのですが、ムリでしょうか?

投稿日時 - 2005-07-28 21:28:32

あなたにオススメの質問