• ベストアンサー

htmlのソースのことでお聞きします!

neko-tenの回答

  • neko-ten
  • ベストアンサー率55% (1287/2335)
回答No.3

画像は左右に並べていいんかね <img src="1    .JPG" style="margin-right:5px" /> <img src="2    .JPG" /> HTMLに「スペースをとる」というタグは存在しません。 preは「成形済みテキスト」であってそれ以上でもそれ以下でもなく、それをどのように表示するかは定義されていません。 ブラウザで動作が変わるってことです。brも改行の意味しかありませんから同じ。 こういった見栄えに関する部分はCSSを使わないと齟齬が出てきますし、HTML的にも間違いです。

kfjbgut
質問者

お礼

左右じゃなしに上下です。 そうですかhtmlでは存在しないのですか・・ 断念です。cssでは利用しているのですが、一部分だけなのでわざわざcssを利用することはないように思ったので。 それに各、ページにおいてバランスというものもでてきますしね・・ その都度、htmlでスペースが取れればいいなあと思ったものですから・・

関連するQ&A

  • オンマウスでの拡大画像の位置指定

    サムネイル画像にオンマウスした時の拡大画像の位置指定がよくわかりません。今の状態だとマウスを乗せた時に拡大画像がサムネイル画像とかぶってしまい、他のサムネイルが隠れてしまいます。できたら、拡大画像をサムネイル画像かぶらせず、左側に表示させたいのですがどう指定したらよいのでしょうか?ついでに拡大画像を右側、上、下に指定したい時の表示方法もあわせてアドバイスいただけたらありがたいです。 それと、サムネイル画像の下にちょっとしたコメントを記載したい時はどうしたら良いのでしょうか?どうかよろしくお願いします。 <script> var src1="image01.jpg" var src2="image1.jpg" var src3="image02.jpg" var src4="image2.jpg" var src5="image03.jpg" var src6="image3.jpg" var src7="image04.jpg" var src8="image4.jpg" </script> <p align="center"> <img src="image01.jpg" onmouseover="this.src=src2" onmouseout="this.src=src1"> <br> <br> <img src="image02.jpg" onmouseover="this.src=src4" onmouseout="this.src=src3"> <br> <br> <img src="image03.jpg" onmouseover="this.src=src6" onmouseout="this.src=src5"> <br> <br> <img src="image04.jpg" onmouseover="this.src=src8" onmouseout="this.src=src7"> <br> </p>

    • 締切済み
    • CSS
  • img のソース変更

    IMGタグの画像データ(***.JPG)を変更したいときは、どうしたらいいでしょうか? 以下のサイトを参考にしましたが、いまいちよくわかりませんでした。 http://bibo-roku.net/1301/78.php <IMG SRC="AAA.JPG"> <IMG SRC="BBB.JPG"> をPHPで <IMG SRC="CCC.JPG"> に変更する方法を教えてください よろしくお願いします。

    • ベストアンサー
    • PHP
  • JavaScriptで画像を変更する

    質問が分かりずらいと思いますが、お願いします。 <body>内に↓が書かれています。 <script language="JavaScript"> <!-- function ChangePics() { for(i = 0; i < 3; i++) document.images[i].src = "white.jpg"; } // --> </script> <img src="black.jpg"><br> <img src="black.jpg"><br> <img src="black.jpg"><br> <form> <input type="button" value="画像一括変更" onclick="ChangePics()"></input> </form> ------------------------------------------------------------ [画像一括変更]ボタンをクリックすると表示されていた3枚の「black.jpg」が「white.jpg」に切り替わります。 ですが、画像のsrcへのアクセスは「document.images[i].src」で 行っているため、 <img src="black.jpg"><br> <img src="black.jpg"><br> <img src="black.jpg"><br> の上に他の画像がある場合はその画像が「white.jpg」に変更されてしまいます。 ですが、<img src="black.jpg" name = "pic1">のようにname属性を付けるのは処理が面倒になるので、避けたいです。 質問の意図は、「作ったJavaScriptのプログラムをブログに載せたいが、そのプログラムの上にほかの画像があるため、正常に動作しない。」ということです。

  • 1箇所に複数画像を別々に配置は可能でしょうか?

    出来ないのかも知れませんが、もし可能かつご存知の方いらっしゃいましたらアドバイスをお願いいたします。 行いたいことは、1つの場所に複数の画像を配置し、それぞれの配置を異なる場所へ置きたいということです。具体的には…、 <div id="hoge"> ←このコンテナ内に画像を複数配置 <img src="img001.jpg" /> ←この画像はセンタリング <img src="img002.jpg" /> ←この画像は右寄せ </div> 1つのDIV内にセンタリングと右寄せで画像を配置という事です。 positionにて相対的に試してみたのですが、中央の<img src="img001.jpg" />のサイズによって<img src="img002.jpg" />の配置が変わってしまうので断念しました。その時は <div id="hoge"> <img src="img001.jpg" /><span id="hage"><img src="img002.jpg" /></span> </div> という感じで、<span id="hage">に相対positionでした…。駄目でしたが。。 条件としてはそれぞれにリンクを定義したいので背景ではなく画像として配置したいと思います。 どなたかアドバイスのほどよろしくお願いします。

    • ベストアンサー
    • CSS
  • CSSで画像を均等に横並びに配置するには?

    テーブルを使わずに、CSSで画像を自由に配置する方法がわからず困っています。 下記のようなイメージで配置したいです。6列。行は可変。 ■…画像 画像の数に応じて、はみだした画像は自動的に下に改行される感じです。 ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ HMTLソースは以下のとおりです。 <ul> <li><a href="*"><img src="img/01.jpg" /></a></li> <li><a href="*"><img src="img/02.jpg" /></a></li> <li><a href="*"><img src="img/03.jpg" /></a></li> <li><a href="*"><img src="img/04.jpg" /></a></li> <li><a href="*"><img src="img/05.jpg" /></a></li> <li><a href="*"><img src="img/06.jpg" /></a></li> <li><a href="*"><img src="img/07.jpg" /></a></li> <li><a href="*"><img src="img/08.jpg" /></a></li> <li><a href="*"><img src="img/09.jpg" /></a></li> <li><a href="*"><img src="img/10.jpg" /></a></li> <li><a href="*"><img src="img/11.jpg" /></a></li> </ul> どのようにCSSを定義すればスマートでしょうか? よろしくお願いします。

  • 正規表現(~を含まないものにマッチ)

    Perlの正規表現について質問です。 画像<img src="http://hogehoge.com/img/gokuu.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="http://hogehoge.com/img/pikkoro.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="http://hogehoge.com/img/bejiita.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="http://hogehoge.com/img/gohan.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="http://hogehoge.com/img/buruma.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> ↓ 処理後 ↓ 画像<img src="gazo_new1.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="gazo_new2.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="gazo_new3.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="gazo_new4.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> 画像<img src="gazo_new5.jpg" border=0><a href="http://hogehoge.com/">hogehoge</a><br> (変更した画像:gokuu.jpg,pikkoro.jpg,bejiita.jpg,gohan.jpg,buruma.jpg,) 以上のように 画像URL部分のみを gazo_new(連番).jpg に変更させ、 変更前の画像URL一覧を表示させるスクリプトを書いてみました。 $htmldata にHTMLの全データが格納されているとします。 $i=1; while($htmldata=~/(<\s*img.*?src.*?=["\s]*)([.\/]*?\/)?((?:(?!gazo_new)[^"\s>])*)?["\s]?.*?>/i){ $imgurlparts .="$3,"; $htmldata=~ s/(<\s*img.*?src.*?=["\s]*)((?:(?!gazo_new)[^"\s>])*)?(["\s]?.*?>)/$1gazo_new$i.jpg$3/i; $i++; } $htmldata .="(変更した画像:$imgurlparts)"; どうにもうまく動きません。 何卒ご教示をお願い致します。

    • ベストアンサー
    • Perl
  • 並べた画像ファイルに不要なスペース行が入ってしまいます(HTML付き)。

    お世話になります。 下記のように、画像ファイルを2つ並べようと思っています。 +---------+ |隅.bmp | +---------+ +---------+ |隅.bmp | +---------+ ただ、上の画像に左側にスペースを入れると、なぜか2つの画像の 間に細いスペース行が入ってしまいます。 この2つの画像の間のスペース行を無くす方法はありますか? <p><img border="0" src="隅.bmp" width="160" height="160"><br> <img border="0" src="隅.bmp" width="160" height="160"><br>  ↓↓↓ <p>&nbsp;<img border="0" src="隅.bmp" width="160" height="160"><br> <img border="0" src="隅.bmp" width="160" height="160"><br> よろしくお願いします。

  • css 背景画像(1つ)とリンク付き画像(複数)を中心に表示したい。(

    css 背景画像(1つ)とリンク付き画像(複数)を中心に表示したい。(超初心者です。) 現在、Kompozerをつかってホームページを作成しています。 添付画像のような配置にしたいので、いろいろなサイトを参照したのですがどうしてもうまくいきません。 現在のソースは以下のようになっており、ブラウザで表示すると背景画像が表示されません。 あまりにも知識がなく、不快な思いをさせてしまったら申し訳ございません。 ご指導いただければうれしいです。 よろしくお願いします。 *ソース <html><head> <meta content="text/html; charset=Shift_JIS" http-equiv="content-type"> <title>ページタイトル</title> <style type="text/css"> </style> </head><body> <div style="text-align: center;" background-image:="" url **.jpg ;width:450px;height:450px;=""><br> <br> <img style="width: 137px; height: 137px;" alt="" src="**.gif" border="0"><br> <br><p style="text-align: center;"> <a href="**.html"><img style="border: 0px solid ; width: 92px; height: 230px;" alt="" src="**.jpg"></a><a href="**.html"><img style="border: 0px solid ; width: 92px; height: 230px;" alt="" src="**.jpg"></a><img style="width: 92px; height: 230px;" alt="" src="**.jpg"><a href="**.html"><img style="border: 0px solid ; width: 92px; height: 230px;" alt="" src="**.jpg"></a><br></p> </div> </body></html>

    • ベストアンサー
    • HTML
  • IE7にのみ有効なCSSソース

    お世話になっております。 写真を縦に4枚並べているのですが、間が4pxあけたいのに、8px空いてしまいます。IEのみ有効のCSSソース「アンダーバー」を使用すると、IE6では、有効ですが、IE7では、有効となりません。いい方法はありますか。 (CSSソース) #left img{ margin:0 4px 4px 4px; _margin:0 4px 0px 4px; /*  IE のみ有効 */ padding:0px; } (Htmlソース) <div id="left"> <h2>取扱商品(一例)</h2> <img src="ephoto/truck1.jpg" width="112" height="83" alt="トラック1" /> <img src="ephoto/truck2.jpg" width="112" height="83" alt="トラック2" /> <img src="ephoto/truck3.jpg" width="112" height="83" alt="トラック3" /> <img src="ephoto/truck4.jpg" width="112" height="83" alt="トラック4" /> <img src="ephoto/truck5.jpg" width="112" height="83" alt="トラック5" /> </div><!-- reft の終了タグ-->

  • 画像をアップさせる時のHTMLソースの作り方。

    こんにちは、ホームページを作ってるのですが、画像をうまく表示できなくて困っています。助言お願いします。画像をFFFTPで縮小してHPで、小さい画像をクリックして、もとの大きさの画像を表示させようと思います。FFFTPで作成されたソース<a href="../4.jpg"><img src="4.jpg" border="0"></a>と表示されましたこれを、TOP.HTMLに書き込んだのですが、小さい画像になってなく、うまく表示されません。 エクスプローラーのツリーは、次のようになってます。 ー[]myHP   └[]img      │     []Resized-4jpg この様になってます。これを、HTMLソースで表すには、どのようにパスを書いたらよろしいですか?教えてくださいよろしくお願いします。

    • ベストアンサー
    • HTML