- ベストアンサー
スライドさせてテーブルの下に画像を・・
初心者です。 いろいろと調べたり、詳しい友人に聞いたのですがうまくいきません。 右上に画像を固定し、左側にテーブル(2列、30行)を配置しました。 画面がフル表示の時はキレイに配置されているのですが、左側に「お気に入り」のバーが現れたり画面を少し小さくすると、テーブルが画像の上にスライドせずに押し出されてどんどん改行され、ひどいことになってしまいます。うまく画像の上にまでスライドさせる方法はありませんでしょうか? ちなみにYahooのジオシティ使用です。 教えてください!!
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
結局何をしたいのか、文面から読み取れないので、想像してみました。 <html> <head> <title>2005年11月</title> <style type="text/css"> <!-- body { background-color:#000000; color:#FFFFFF; background-image:url(画像); background-repeat:no-repeat; background-position:right top; } table { background-color:#FFFFFF; border-collapse:collapse; color:#000000; width:52%; } th,td { font-size:12px; font-weight:normal; text-align:left; border:1px solid #000000; } th {width:30%;} --> </style> </head> <body> <h1>~2005年11月~</h1> <table> <tr> <th>1火</th> <td> </td> </tr> <tr> <th>30水</th> <td> </td> </tr> </table> </body> </html> スタイルシートを使ってます。難しいでしょうが、解読してください。上記の「画像」の部分はご使用の画像パスを入れてください。そのままコピペして使用できます。 提示していただいたhtmlを見ると、align="right"を勘違いして使用しているような気がします。これは「右に固定する」という意味ではありません。(話すと長くなるので省略)
その他の回答 (1)
こんなのはどうでしょう? 1・1行2列のベースとなるテーブルを作る。 2・そのテーブルの左の列に2列3行のテーブル、右の 列に画像を入れる。 つまり、入れ子の状態にします。 なお、タグは以下のようになります。 <table><tr><td> <table> <tr><td>【1列目】</td><td>【2列目】</td></tr> ↑これを30回繰り返し </table> </td> <td><img src="画像の名前"></td></tr></table> 間違っていたらごめんなさい^^;
お礼
回答、ありがとうございます! さっそく試して見ました。 テーブルの中にテーブルを作る・・なるほどと思いました。 でもなんとかやってみたのですが、フル表示にしたときに画像が真ん中にきてしまって・・^^; すみません! でも勉強になりました。 ありがとうございました!
補足
ちなみに下記がタグです。 <html> <head> <title> 2005年11月 </title> </head> <body> <body bgcolor="#000000" text="#ffffff"> <img src=画像 width=550 height=450 ALIGN="right"> <BE><BR><font size=6><B>~ 2005年11月 ~</B></font><BR><BR> <!--ここから--> <table border="1" width="52%"> <tr> <td><table border="0" width="100%"height=15><tr> <td bgcolor="#ffffff" width="30%"><font color="#000000"> <center> 1 火 </font></td> <td bgcolor="#FFFFFF" width="70%"><font color="#000000"> <!-- 1日記入 --> </font></td></tr> </table></td> </tr> <tr> <td><table border="0" width="100%"><tr> <td bgcolor="#FFFFFF" width="30%"><font color="#000000"><center> 30 水 </font></td> <td bgcolor="#FFFFFF" width="70%"><font color="#000000"> <!-- 30日記入欄 --> </font></td></tr> </table></td> </tr> </table> <!-- ここまで --></center> </body> </html>
お礼
教えていただいた通りにしてみたところ、 できました! ありがとうございました。