
こんにちは。
HTML超初心者です。初心者のくせして作りたい形は頭にあったりします。
画像がランダムに表示されるjavascriptをコピーしてきました。
画像を入れ替えて、それがちゃんと表示されています。
その画像の表示されている上の位地にtableを入れたいのですが、
書き込んでみても、ランダムに表示される画像と横にならんでしまいます。
どのようにしたら、tableと画像を縦に並ばせることができるのでしょうか?
かなり初歩的なことだと思いますが、どなたかよろしくお願いします。
ちなみに下のようなjavascriptです。
<SCRIPT language="JavaScript">
<!--
// ランダムに画像を表示する
img = new Array();
img[0] = "img/img0.jpg";
img[1] = "img/img1.jpg";
img[2] = "img/img2.jpg";
img[3] = "img/img3.jpg";
img[4] = "img/img4.jpg";
n = Math.floor(Math.random()*img.length);
document.write("<img src='"+img[n]+"' border='0'>");
//-->
</SCRIPT>
No.1ベストアンサー
- 回答日時:
これでどうですか?
単純に、img要素をブロック要素の中に入れてあります。
---
<html>
<head>
<script type="text/javascript">
window.onload = function() {
var list = ['1.jpg', '2.jpg', '3.jpg', '4.jpg'];
var img = document.getElementById('a');
img.setAttribute('src', list[Math.floor(Math.random() * list.length)]);
}
</script>
<style>
table { border-collapse: collapse; }
td { border: 1px solid #000; }
</style>
</head>
<body>
<table>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>4</td><td>5</td><td>6</td></tr>
<tr><td>7</td><td>8</td><td>9</td></tr>
</table>
<div>
<img id="a" src="#"/>
</div>
</body>
</html>
うまくいきました!回答ありがとうございます。
そしてお礼が遅れて申し訳ありません。
入れ子を後でもっといじってみたいと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ブラウザによってレイアウトが...
-
IE セル間に隙間が・・・
-
ノーマルヤリスとGRヤリス
-
HTMLでクロス抽出したい
-
パソコンでランドルト環の作成...
-
PDFへてのテキストボックスにて...
-
htmlでテーブル内にテキストボ...
-
CSSのtransform: translate(-50...
-
aタグに直接style=""で:hoverを...
-
Excel セルの幅が合わない
-
【エクセルVBA】シェイプのサイ...
-
Excelの列や行の幅を表示...
-
パソコンサイズが横30cm縦20cm...
-
昼間 ずっとゴロゴロと横になっ...
-
excel初心者です。 セルの色変...
-
Excelで文字の幅を変える方法
-
GIMPについて質問
-
Excel で等間隔で縦線を引きた...
-
敬語
-
ホームページビルダーで表の列...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
table内で画像と文字をセンター...
-
<td> 内のテーブルを上寄せにす...
-
テーブルで3セル作った行の下に...
-
Excelで可視部分だけをWeb形式...
-
表の中でのフォーム
-
HTMLでテーブルを縦に並べたい!
-
vbsでIEの操作
-
Jimdoで表組のなかの画像をポッ...
-
CSS line-height が効かない
-
WebにてExcelを生成してダウン...
-
Dreamweaverでソースが横一列に...
-
HTMLの行と行の間隔のあけ方
-
tableで横スクロールバーが・・
-
文字数によってsubmitできない
-
表の各セルの高さの設定について
-
複数集計をしたい
-
Webの表で画像を並べたい
-
楽天オークション HTMLエラー
-
cssのfont-sizeがFirefoxで効か...
-
テーブルの中のグラデーション...
おすすめ情報