• ベストアンサー

htmlで文字列の回り込みが上手くできません。

htmlの勉強を始めた初心者です。 画像の右側に文字を回り込ませようと下記のように入力したのですが、うまくできません。 どこがおかしいのでしょか？ アドバイス宜しくお願いします。 <html> <head> <title>xxx</title>　 </head> <body> <img src="xxx.jpg" width="145" height="40" align="left"> <h3>～xxxxx～</h3> </body> </html>

  • HTML
  • 回答数8
  • ありがとう数5

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

  • ベストアンサー
  • Nine-nine
  • ベストアンサー率49% (25/51)
回答No.4

<html> <head> <title>xxx</title> <style> h3{ background:(xxx.jpg) no-repeat; padding:160px; height:40px } </style> </head> <body> <h3>～xxxxx～</h3> <p>本文</p> <h3>～xxxxx～</h3> <p>本文</p> <h3>～xxxxx～</h3> <p>本文</p> </body> </html> 今のやり方はこんな感じですね。見出しｈ3とhtmlでは書いておいて、h3に対して別の場所でデザインを付けます。今の場合、xxx.jpgを見出しのマーク（キャッチアイ）という扱いにしています。 ｈ3という見出しの格が出てきた場合は何度でも同じスタイルが適用されます。 今のやり方を覚えたいなら、お手持ちの本は参考にされない方がいいです。 入門にお奨めのサイトをいくつか上げておきます。 ●ごく簡単なHTMLの説明 http://www.kanzaki.com/docs/htminfo.html 30分間HTML入門とスタイルシートに一度目を通され、実行されることをお奨めします。細かいことより概念を覚えることで今後も間違ったサイトを避けることができますし、習得の近道です。 ちょっと、小難しそうでどうしても馴染めない場合は、以下のどれか１つを1つだけでいいですから、一通り通してみてください。どれも基本だけです。 ●ちょっと詳しいHTMLとCSS http://mynotes.jp/lecture/html-css/ 最初に間違えた学習をした人の為に書かれてます。真っ白は人ならスーっと入ります。 ●初心者のためのホームページ作成講座 http://members.jcom.home.ne.jp/jintrick/Personal/markup.html 最初からきちんとした方法で覚えることができれば「簡単」。しかし最初に間違った方法で覚えてしまうと「異常に難しい」のが、HTMLです。 ●はじめてのWebドキュメントづくり http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ パステルとーんでとっつきやすく表現されてます。 ●ウエブサイト作成ガイド http://www.oyakonews.com/oyanews/homep/creating.html 見た目で作れるオ－サリングの長短から説明され、その後手打ちの作成講座に移行します。 それと、自らを初心者という言葉は、努力しない言い訳に使われてきたので、Ｑ＆Ａサイトでは嫌われる傾向があります。初心者・教えてチャンなどと毛嫌いされ、スルーされることが多いので、使われない事をお奨めします。

その他の回答 (7)

noname#66720
noname#66720
回答No.8

HTMLで構造を・・・　→　HTMLで見た目を・・・ でした。訂正します。

redcurb
質問者

お礼

大変参考になりました！ありがとうございます。

noname#66720
noname#66720
回答No.7

＞alignは推奨されていない属性との事ですが、使わない方がいいという事でしょか？ そうですね。携帯専用のページだとまだ必要かもしれませんが、PCで見るページであればalignは推奨されていません。 変わりにCSSでtext-alignやmarginを使うことになります。 HTMLはタグによって意味づけをする・CSSは見た目を扱う、というように役割を分けることによって、見た目のせいで閲覧が難しいページでも CSSをオフにすることで、最低限内容だけは伝えられるというメリットがあります。 HTMLで構造を定義すると閲覧者の融通が効かないんですね。

  • Nine-nine
  • ベストアンサー率49% (25/51)
回答No.6

お恥ずかしい。まだ、ミスがありました。 書き直します。 <html> <head> <title>xxx</title> <style> h3{ background:url(xxx.gif) no-repeat 0 0; padding-left:160px; height:40px } </style> </head> <body> <h3>～xxxxx～</h3> <p>本文</p> <h3>～xxxxx～</h3> <p>本文</p> <h3>～xxxxx～</h3> <p>本文</p> </body> </html>

redcurb
質問者

お礼

とんでもない。大変参考になりました。教えて頂いたサイトも大変参考になりました。ありがとうございました！

  • Nine-nine
  • ベストアンサー率49% (25/51)
回答No.5

ごめん、ミスった padding:160px; を padding-left:160px; に変えてください。

  • Nine-nine
  • ベストアンサー率49% (25/51)
回答No.3

＃1です。 私、img はh3への装飾じゃないかと最初考えたです。バックグランドかなぁ？と。今インラインとか言っても理解できないんじゃないかなぁと、でも＃2さんの答えがでましたので、imgの意味を聞きたいですね。 imgの中身は、h3へのキャッチアイ的なすべてのｈ3に共通することですか？それとも、１回ずつ変わるそれが他のものに置き換わってはいけない意味あるものですか？ もし、キャッチアイならh3だけでできます。ｈ3だけでする方が、正式なやり方なので、もしよければ教えてください。

redcurb
質問者

お礼

確かにインラインの意味が分かりません。 すみません、文章の意味がよく分かりません。 初心者もので・・・

noname#66720
noname#66720
回答No.2

とりあえずimgはインライン要素なのでpなりdivなりで囲ってやりましょう。 そしてalignは推奨されていない属性なので、pに対してcssでfloatを指定します。 <head> <style type="text/css"> p {float:left;} </style> </head> <p><img src="xxx.jpg" width="145" height="40"></p> <h3>～xxxxx～</h3>

redcurb
質問者

お礼

アドバイスの通りやりましたが、うまく出来ません。 alignは推奨されていない属性との事ですが、使わない方がいいという事でしょか？

  • Nine-nine
  • ベストアンサー率49% (25/51)
回答No.1

多分できていると思うけど、 ｈ3ってページ内で３番目に大きな「見出し」って意味なのさ。それで、見出しは「かたまり」として扱われるお約束なので、前後に改行が入るお約束になっています。 だから、<h3>なんてせずに <body> <img src="xxx.jpg" width="145" height="40" align="left">あああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ <h3>～xxxxx～</h3> </body> </html> とかでＯＫ？ それと始めたばかりなら、変な先生に掛かっちゃダメだよ。昔のやり方を覚えると今のやり方にするのに苦労するから。とりあえず文字の大きさを変えるには<font size=>なんて説明や太くするには<b></b>で挟みましょう。って説明のところは全体に避けた方が、いいから。気をつけてね。 そんなことには全く触れないところで勉強される事をお奨めします。

redcurb
質問者

お礼

アドバイスありがとうございます。前後に改行が入るお約束になっているとは知りませんでした。 独学で本を読みながら勉強しているのですが、本変えた方がいいのでしょうか？ 太字は<b>で挟めって書いてあるので・・・

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • CSSでfloat指定した画像に隙間

    floatの指定をすると並べた画像に隙間ができます。 div aで外を囲み、幅を400px固定し、 その中にli(幅200px）を放り込んでいます。 （幅400pxの入れ物に200pxの小箱を2列に並べていく） 画像をfloatさせなければ隙間は出ないのですが、下記cssのようにfloatさせると幅400pxにIEだけ収まりません。 WinXP・irefox1.0やOpera7.5では意図通り表示されます。。 どなたか解決策お持ちの方よろしくおねがいします。 <html> <head> <title></title> <style type="text/css"> <!-- #a{ width:400px; margin: 0 auto; padding:0; } li{ width:200px; padding:0; list-style:none; float:right; display: inline; } img{ border:none; margin:0; padding:0; vertical-align:top; float:left;　←これの有無で不具合 } --> </style> </head> <body> <div id="a"> <dl> <li> <img src="xxx.jpg" width="150" height="200" /><img src="xxx.jpg" width="50" height="100" /><img src="xxx.jpg" width="50" height="100" /></li> <li> <img src="xxx.jpg" width="150" height="200" /><img src="xxx.jpg" width="50" height="200" /></li> </dl> </body> </html>

    • ベストアンサー
    • HTML
  • html内かscript内で画像出力。どちらが軽い

    ホームページの読み込みは、画像を使えば使うほど重くなってしまいます。 下記コードでは、(1)と(2)で1.jpg～5.jpgの画像をページに出力しています。 (1)はHTMLに、(2)はscript内に、 (1)と(2)では(2)の方がhtmlに<img src=".jpg" width="800" height="300"/> と書かなかった分、ページが重くならない、ということになりますか？ <html> <head> <title>HTML上に直接imgを出力した場合</title> </head> <body> <img src="1.jpg" width="800" height="300"/> <img src="2.jpg" width="800" height="300"/> <img src="3.jpg" width="800" height="300"/> <img src="4.jpg" width="800" height="300"/> <img src="5.jpg" width="800" height="300"/> </body> </html> <html> <head> <title>HTML上にはimgを出力せず、script内でimgを出力した場合</title> <script language="JavaScript"> var imgSanple = new Array( "1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg"); var randomSelect = Math.floor((Math.random() * 100)) % imgSanple.length; var i = "<img src='"+imgSanple[randomSelect]+"' width='800' height='300'>"; document.write(i); // --> </script> </head> <body> <noscript> <img src="1.jpg" width="800" height="300"> </noscript> </body> </html>

  • IE6とその他のブラウザでセンターの位置が【微妙】にずれる・・・

    XHTML+CSSで作ったのですが、ブラウザのチェックをしたところIE６だけ一部右寄りになってしまいます。 一部というのは、上から「head」「nav」「main」「wrap」としているのですが「nav」と「wrap」部分だけが微妙に右寄り、もしくはその他が微妙に左より？になってしまいます。 センター寄せには基本的に「0px auto」を使用しているので、色々調べたところ、それが原因？と思い、「textalign center」にしてもなぜか少しずれてしまいます。 ためしに、headとnavだけのスリムな状態にしても同じでした。。。 解決方法に心当たりのある方はお願いします。 【CSS】 @charset "shift_jis"; * { line-height: 150%; font-size: 12px; letter-spacing: 1px; } body{ margin:0px; padding:0px; text-align:center; background-repeat: no-repeat; } img { border: none; vertical-align: bottom; } h1 { font-weight: normal; margin: 15px 0 0 50px; } #head{ width:900px; height:69px; background-image: url(img/bg-head.jpg); margin: 0px auto; text-align: left; } #nav { width: 100%; background-image: url(img/bg-nav.jpg); } #nav ul { margin: 0px auto; width: 900px; padding: 0px; list-style: none; height: 31px; } #nav li { float: left; } #main { width: 100%; height: 284px; text-align: center; background-image: url(img/bg-main.jpg); } #wrap{ width:880px; margin:0px auto; text-align:left; padding: 0 10px 0 30px; background-image: url(img/bg-wrap.jpg); background-repeat: repeat-y; } #left{ width:645px; float:left; } #right{ width:220px; float:right; text-align: right; padding: 0px; height: 1200px; background-image: url(img/bg-right.gif); } #foot{ position:relative; width:100%; height:35px; clear:both; background-image: url(img/bg-foot.gif); margin: 0 0 50px 0; } 【html】 <body> <!-- ********* ヘッダー ******** --> <div id="head"> <h1>\\\\\\\\\\\\\\\\\\</h1> </div> <!-- ***** nav ****** --> <div id="nav"> <ul> <li><img src="img/nav_01.jpg" /></li> <li><img src="img/nav_02.jpg" /></li> <li><img src="img/nav_03.jpg" /></li> <li><img src="img/nav_04.jpg" /></li> <li><img src="img/nav_05.jpg" /></li> <li><img src="img/nav_06.jpg" /></li> <li><img src="img/nav_07.jpg" /></li> </ul> </div> <!-- ***** main ****** --> <div id="main"><img src="img/main.jpg" /></div> <div id="wrap"> <!-- ********* 左側 ******** --> <div id="left"> </div> <!-- ********* 右側 ******** --> <div id="right"> </div> <br style="clear:both" /> </div> <!-- ********* フッター ******** --> <div id="foot"> </div> </body>

    • ベストアンサー
    • HTML
  • XOOPS カスタムブロックに　htmlを配列

    始めまして！ 初めて投稿させて頂きます。 XOOPSのカスタムブロックにhtmlで表示したいのですが、イメージ通り表示出来ないでおります。 htmlの知識も無い無謀者ですが、どうかご指導の程宜しくお願い致します。 【やりたい事】 ブロックの左側にアイコンに続きtxtを挿入、右側にイメージ画像のアフリエイトを配置したいのですが、表示がイメージ通り出来ません。 添付ファイル画像（１） ・配置したいイメージ 添付ファイル画像（２） ・現状 ・現状のソース <P><Div Align="left"><IMG src="file:///C:/Users/xxx/Desktop/folder858.png" width="24" height="24" border="0">test01<BR></Div> <Div Align="left"><IMG src="file:///C:/Users/xxx/Desktop/folder858.png" width="24" height="24" border="0">test02<BR></Div> <Div Align="left"><IMG src="file:///C:/Users/xxx/xxx/folder858.png" width="24" height="24" border="0">test03<BR></Div> <Div Align="left"><IMG src="file:///C:/Users/xxx/xxx/folder858.png" width="24" height="24" border="0">test04<BR></Div> <Div Align="left"><IMG src="file:///C:/Users/xxx/xxx/folder858.png" width="24" height="24" border="0">test05<BR></Div> <Div Align="left"><IMG src="file:///C:/Users/xxx/xxx/folder858.png" width="24" height="24" border="0">test06<BR></Div> <Div Align="left"><IMG src="file:///C:/Users/xxx/xxx/folder858.png" width="24" height="24" border="0">test07<BR></Div> <Div Align="left"><IMG src="file:///C:/Users/xxx/xxx//folder858.png" width="24" height="24" border="0">test08<BR></Div> <Div Align="right"><script type="text/javascript"><!-- google_ad_client = "pub-ｘｘｘｘｘｘｘｘｘ"; /* 200x200, 作成済み 09/06/15 */ google_ad_slot = "ｘｘｘｘｘｘ"; google_ad_width = 200; google_ad_height = 200; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script></Div> ご指導宜しくお願い致します。

  • ＣＳＳレイアウトの配置ずれについて

    本を見ながらＨＴＭＬとＣＳＳを作成したのですが、どのブラウザで見てもclass指定した"slideItems"の位置が右にズレてしまいます。解決方法わかる方、教えてください。 以下、htmlとcssです。 html↓ <body> <div id="newBook"> <div class="item"> <ul id="slideItems"> <li><a href="#"/><img src="img/IMG_0162.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム1</h4> <p>コメント1</p> </li> <li><a href="#"/><img src="img/IMG_0135.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム2</h4> <p>コメント2</p> </li> <li><a href="#"/><img src="img/IMG_0164.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム3</h4> <p>コメント3</p> </li> <li><a href="#"/><img src="img/IMG_0140.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム4</h4> <p>コメント1</p> </li> <li><a href="#"/><img src="img/IMG_0171.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム5</h4> <p>コメント1</p> </li> <!--2ページ--> <li><a href="#"/><img src="img/IMG_0162.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム1</h4> <p>コメント1</p> </li> <li><a href="#"/><img src="img/IMG_0135.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム2</h4> <p>コメント2</p> </li> <li><a href="#"/><img src="img/IMG_0164.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム3</h4> <p>コメント3</p> </li> <li><a href="#"/><img src="img/IMG_0140.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム4</h4> <p>コメント1</p> </li> <li><a href="#"/><img src="img/IMG_0171.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム5</h4> <p>コメント1</p> </li> <!--3ページ--> <li><a href="#"/><img src="img/IMG_0162.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム1</h4> <p>コメント1</p> </li> <li><a href="#"/><img src="img/IMG_0135.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム2</h4> <p>コメント2</p> </li> <li><a href="#"/><img src="img/IMG_0164.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム3</h4> <p>コメント3</p> </li> <li><a href="#"/><img src="img/IMG_0140.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム4</h4> <p>コメント1</p> </li> <li><a href="#"/><img src="img/IMG_0171.jpg" alt="サンプル画像" width="50" height="63" /> <h4>サンプルアイテム5</h4> <p>コメント1</p> </li> </ul> </div> <div class="leftBtn"> <a href="javascript:startmove('left');"><img src="img/prev.gif" alt="左へ" width="25" height"25" border="0" /></a></div> <div class="rightBtn"> <a href="javascript:startmove('right');"><img src="img/prev_r.gif" alt="左へ" width="25" height"25" border="0" /></a> </div> </div> </body> css↓ #newBook { margin: 30px; position: relative; } .item { height: 115px; width: 500px; padding: 10px 0px; overflow: hidden; position: absolute; left: 40px; top: 0px; } .leftBtn,.rightBtn { text-align: left; width: 40px; position: absolute; top: 0px; } .leftBtn { text-align: left; left: 0px; } .rightBtn { text-align: right; left: 540px; } .item ul { width: 1500px; position: absolute; left: 0px; top: 0px; } .item li { background-color: #999999; height: 100px; width: 100px; list-style-type: none; padding: 10px 0px 5px; float: left; text-align: center; } #slideItems { position: absolute; left: 0px; top: 0px; }

  • HTMLのことで・・・・・・・・。

    さきほども質問したのですが、少々説明不足だったので、もう一度質問したいと、思います。。。；；； この下は、今の私のソースです； ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー <Html> <Head> <Title>～</Title> </Head> <Body> </div> このバナー <!-- content end --> <!-- topleft --> <div id="left"> <a href="#"><img src="ban_seitokai.jpg" width="200" height="60" alt="生徒会の一存"></a> <br> <a href="#"><img src="bn_key.gif" width="200" height="60" alt="key"></a> <a href="#"><img src="" width="" height="" alt=""></a> <a href="#"><img src="" width="" height="" alt=""></a> </div> <div id="right"> <div align="center"><h1>タイトル</h1></div> <p>文章</p> </div> </div> <!-- topleft end --> </div> <!-- maincontent end --> </Body> </Html> ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー この画像の上の図が↑のソースです。 下の図は、『こうしたい』という図です。 画像の隣に文章を表示させたいのですが、どうすればなりますか？ できれば、わかりやすく、例や見本を書いてくれますと助かります；

  • CSS画像・文字混在縦メニュー

    画像と文字使った縦メニューを作成しています。 レイアウトがズレたり隙間ができたりでどうしてもうまくいきません。 どうぞお知恵をお貸しください。 よろしくお願いいたします。 【CSS】 @charset "utf-8"; /* CSS Document */ /* ナビ設定 */ #navi1 { margin: 0px; padding: 0px; position: relative; right: 10px; width: 200px; float: right; } #navi1 li { margin: 0px; padding: 0px; position: relative; width: 200px; float: right; } #navi1 #navi1_title { width: 200px; position: relative; } .sub_menu { width: 190px; position: relative; float: right; left: 5px; } .sub_menu ul { list-style: none; border-top: 1px solid #CCCCCC; width: 190px; position: relative; } .sub_menu li { border-bottom: 1px dashed #CCCCCC; background: #F3F0EA url(img/xx.jpg) no-repeat left center; width: 190px; } .sub_menu a { display: block; /*Windows IE対策のため、ボックス幅を指定 */ width /**/: 180px; /*Window IE5用の値を指定 */ color: #666; text-decoration: none; font-size: 11px; padding-top: 4px; padding-right: 4px; padding-bottom: 4px; padding-left: 10px; background-color: #F3F0EA; background-image: url(img/xx.jpg); background-repeat: no-repeat; background-position: left center; left: 3px; } .sub_menu a:hover { color: #666; width: 180px; background-color: #E4DECF; background-image: url(img/xx.jpg); background-repeat: no-repeat; background-position: left center; } 【HTML】 <div id="navi1"> <h2><img src="img/menu1_title.png" width="200" height="50" alt="qqq" /></h2> <ul> <li><img src="img/menu_y.png" width="200" height="32" alt="zzz" /></li> </ul> <ul class="sub_menu"> <li><a href="#">yyy</a></li> <li><a href="#">yyy</a></li> <li><a href="#">yyy</a></li> <li><a href="#">yyy</a></li> <li><a href="#">yyy</a></li> <li><a href="#">yyy</a></li> </ul> <ul> <li><a href="#"><img src="img/menu_a.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_b.jpg" width="200" height="32" alt=xxx" /></a></li> <li><a href="#"><img src="img/menu_c.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_d.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_e.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_f.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_g.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_h.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_i.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_j.jpg" width="200" height="32" alt="xxx" /></a></li> <li><a href="#"><img src="img/menu_k.jpg" width="200" height="32" alt="xxx" /></a></li> </ul> </div>

    • ベストアンサー
    • HTML
  • 画像を一杯に表示できない

    PCでもスマホでも画像を幅一杯に表示させたいです。全画面表示ではありません。できればCSSファイルは別途作成せず、１つのHTMLファイルですませたいです。そこで以下のソースを書きましたが、画像x.jpgのサイズが、画面の大きさを変えても、変わりません <head> <style type="text/css"> img.example1 { width: 100%; height:auto; } </style> </head> <body> <div align="left"> <table width="100%" align="left" bgcolor="#FFFFFF"> <tr> <td width="100%"> <p><img src="x.jpg" alt="x" "class="example1"> </p> </img> </td> どうしたら良いでしょうか？

    • 締切済み
    • CSS
  • 限界に来てしまいました、教えて下さい。

    まだ何も解ってないのに、本を見ながら自分のページを作り始めたのですが、 ココが限界で行き詰ってしまいました、どなたか手を貸して下さい。 2つのフレームに分けて、leftにはテキストと、日記などのリンクを設定し、 topフレームで、そのリンクのページを見せる事にしました。 其処までは何とか出来て、一応公開しています。 今度は、そのtopページにenterをつけて次のページに移るようにしたいのですが、 その方法が解りません、フレームを使ってるとそういう事は出来ないんでしょうか。 後、フレームごとに次へ進めるという事は出来るものでしょうか。 質問が判り辛くてすみません、よろしくお願いします。 全体 <title> </title> </head> <frameset cols="35%,65%"> <frame src="left.html"marginheight="30" marginwidth="40"> <frame src="top.html"name="frame1"marginheight="20" marginwidth="70"> </frameset> トップ・フレーム <title>・top</title> <style type="text/css"> body{background-image:url(starchart.gif);} p{color:"008080";} </style> </head> <body> <img src="logo12.gif"width="268"height="85"alt="ロゴ"align=left;> <img src="umi6.jpg"align="center";><br> <img src="cimgss.JPG"alt=" ";><br> <img src="namigatarogo.gif"align=center;> <img src="umi2.jpg"aligh="right";> <br><br> <p><i>Last Update：2006/01/24</i></p> </body> 長くなるので、レフトは省きました。

  • センタリングのＨＴＭＬの挿入場所

    お世話になっております。 前回の質問の追加をしようとしたのですが、うまくできず、新たにスレッドを立てました。すみません。 以下のＨＴＭＬは横並びに写真を載せたもの（数行あります）です。（上部に文章を載せるための式がありますが、カットしています。）このプログラムのどこにセンタリングの式を入れたらいいのか、私の知識ではわかりませんでした。またご教示もらえると助かります。 よろしくお願いします。 </DIV> <DIV style="top : 1313px; </DIV> <DIV style="top : 1473px;left : 327px; position : absolute; z-index : 3; " id="Layer8"><IMG src="button2.gif" width="81" height="35" border="0" alt="Ｂａｃｋ"></DIV> <DIV style="top : 1060px;left : 21px; position : absolute; z-index : 8; width : 698px; height : 123px; " id="Layer6">&nbsp;　 <IMG src="DSC_19711.jpg" border="0" width="160" height="106"> <IMG src="DSC_20401.jpg" border="0" width="160" height="106"> <IMG src="DSC_20541.jpg" border="0" width="160" height="106"> <IMG src="DSC_21231.jpg" border="0" width="160" height="106"></DIV> <DIV style="top : 883px;left : 15px; position : absolute; z-index : 7; width : 649px; height : 165px; " id="Layer5">&nbsp;　　 <IMG src="DSC_19311.jpg" border="0" width="160" height="106"> <IMG src="DSC_19381.jpg" border="0" width="160" height="106"> <IMG src="DSC_19411.jpg" border="0" width="99" height="149"> <IMG src="DSC_19631.jpg" border="0" width="160" height="106"></DIV> <DIV style="top : 572px;left : -3px; position : absolute; z-index : 5; " id="Layer3"> <DIV> <TABLE border="0" cellpadding="15" width="725" height="147"> <TBODY> <TR> <TD height="113" width="549" align="center" style="position : relative;table-layout : auto;">&nbsp;　　 <IMG src="DSC_17481.jpg" border="0" width="160" height="106"> <IMG src="DSC_18051.jpg" border="0" width="160" height="106"> <IMG src="DSC_18151.jpg" border="0" width="160" height="106"> <IMG src="DSC_18351.jpg" border="0" width="160" height="106"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> <DIV style="top : 729px;left : 12px; position : absolute; z-index : 6; " id="Layer4"> <DIV> <TABLE border="0" cellpadding="15" width="725" height="147"> <TBODY> <TR> <TD height="113" width="549" align="center" style="position : relative;table-layout : auto;">&nbsp;<IMG src="DSC_18421.jpg" border="0" width="160" height="106"> <IMG src="DSC_18641.jpg" border="0" width="160" height="106"> <IMG src="DSC_18941.jpg" border="0" width="160" height="106"> <IMG src="DSC_19201.jpg" border="0" width="160" height="106"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> </BODY>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する