- ベストアンサー
画像をアップさせる時のHTMLソースの作り方。
こんにちは、ホームページを作ってるのですが、画像をうまく表示できなくて困っています。助言お願いします。画像をFFFTPで縮小してHPで、小さい画像をクリックして、もとの大きさの画像を表示させようと思います。FFFTPで作成されたソース<a href="../4.jpg"><img src="4.jpg" border="0"></a>と表示されましたこれを、TOP.HTMLに書き込んだのですが、小さい画像になってなく、うまく表示されません。 エクスプローラーのツリーは、次のようになってます。 ー[]myHP └[]img │ []Resized-4jpg この様になってます。これを、HTMLソースで表すには、どのようにパスを書いたらよろしいですか?教えてくださいよろしくお願いします。
- みんなの回答 (4)
- 専門家の回答
質問者が選んだベストアンサー
imgの方のパス指定が間違っているということですが Resizedのフォルダ名が全角になってるとかそういうことはないですよね ファイル構成はこれであってますか? [myHP] ├TOP.HTML └[img] ├4.jpg(元画像) └[Resized] └4.jpg(縮小画像)
その他の回答 (3)
- -Kei
- ベストアンサー率50% (151/299)
<a href="img/4.jpg"><img src="img/Resized/4.jpg" border="0"></a> これでいいと思います。
お礼
早速やってみました。が、トップページには、四角の中に×印があるマークが表示されてました。これをクリックすると、大きなサイズで表示がされました。困った、なぜトップページに小さい画像が出ないのか?気づいた事があるのですが、Resizedフォルダの中に、20070623.HTMLファイルがあるのですけど、これもトップページHTMLに書き込まないと都合悪いのでしょうか?ひき続きよろしくお願いします。それにしても階層表記むずかしいです。
- -Kei
- ベストアンサー率50% (151/299)
><a href="../4.jpg"><img src="4.jpg" border="0"></a> <a href="[大きい画像までの相対パス]/大きい画像のファイル名"><img src="[小さい画像までの相対パス]/小さい画像のファイル名" border="0"></a> にしないとダメです。 TOP.HTMLがあるのは小さい画像と同じディレクトリですか? ファイルの構成がどうなってるのかよくわからないんですが <a href="../4.jpg"><img src="../Resized-4.jpg" border="0"></a> <a href="../4.jpg"><img src="../Resized/4.jpg" border="0"></a> <a href="../4.jpg"><img src="Resized-4.jpg" border="0"></a> <a href="../4.jpg"><img src="Resized/4.jpg" border="0"></a> この中のどれか1つでいけませんか? 上の階層に移動するときは「../」 下の階層に移動するときは「移動したいフォルダ名/」 です。
補足
回答いただき有難うございます。補足させていただきます。 TOP.HTMLは、myhpフォルダに入ってます。 小さい画像は、myhpフォルダの中のimgフォルダの中のResizedフォルダにあります。以上補足でした。
- metis
- ベストアンサー率52% (86/165)
確認と補足要求です。 ・ウェブページのデータは、全て「myHP」フォルダ以下に入っている ・「myHP」フォルダの中に、「img」というフォルダがあり、その中に「Resized-4.jpg」という、縮小した画像ファイルが入っている。 と言うことですよね。 ・「FFFTPで~」と言う件が分かりにくいです。何かしら他のソフトで編集した物を、FFFTPを使ってアップロードした、と解釈してよろしいでしょうか。(違う場合、具体的にどういう手順で縮小やソースの作成を行ったかを補足頂けると幸いです。) では補足要求です。 ・「小さい画像」や「大きい画像へのリンク」を貼ってあるページはどこにありますか? ・元の(大きいサイズの)画像はどこにありますか?そのファイル名は?
補足
ありがとうございます。小さい画像は、imgフォルダの中のResizedの中に入ってます。元の画像は、myhpフォルダの中のimgフォルダに入ってます。FFFTPの事は、勘違いで「縮小専用」というソフトで縮小したら、質問に書いたソースが作成されました。すみません勘違いしてました。ひき続きよろしくお願いします。
お礼
keiさん、ホント済みません! http://i-section.net/software/shukusen/←このソフトの設定ミスでした。新たに、「変換後ファイルの名の前にs-をつけて保存」にチェックして、縮小すると、imgフォルダの中にs-4.jpgができてました。その時のソースが、<a href="4.jpg"><img src="s-4.jpg" border="0"></a> になっていました。これで表示する事が出来ました。そこで最後に、おさらいをさせて下さい、今作った、s-4.jpgが、Resizedにある時は、上の、ソースに当てはめればよろしいのですよね? 本当に私のミスで始まった、この質問に最後までお付き合い頂き誠にありがとうございました。次回もよろしくお願いします。
補足
ありがとうございます。フォルダ名半角でした。 エクスプローラーの左に表示されるツリーは、myhp,img,Resizedの順で右斜め下に階段のように等間隔で表示されてます。 myhpを開くと、top.html.imgなどが表示されimgを開くとResizedが表示されResizedを開くと4.jpgがあります。こんな道順です。お疲れと思いますが、もう少しお付き合いください、よろしくお願いします。