Q&A
<img src="">については他の方が回答されているので質問に関してですが、あまりに解決に向かわないようでしたら階層とHTMLのソースを丸々コピペして頂ければ解は得られると思います。
が、m.ts10806さんの回答にある通り、｢相対パスと絶対パス｣を理解していれば自分で解決出来る内容かと思います。
分からなければ調べてみれば参考記事はいくらでも見つかるのでチャレンジしてみてください。
プログラミングの勉強を最近始めた初心者です。
HTMLの画像取り込みについて
<img src="images/〜">
で画像を取り込めると思うのですが、自分が持ってる画像を取り込み、確認すると画像自体は表示されず、四角いマーク？が表示されます。
取り込めない画像なのかと思い、別の画像を入力したのですが、同じように四角のマークが入るだけです。
何が原因でしょうか？
a.pngにまずは変えてみましたが、反映されません。
〈a.png="/〜.png"〉←間違えてるところがありますか？
行き違いだったため削除.
回答3件
0
ベストアンサー
そもそも文法を理解出来ていなさそうなので、まず、画像をhtmlで表示するには<img>タグを使います。
<img>の必須属性としてsrc属性があります。これは画像ファイルのURLを指定する属性です。
HTML
1<img src="a.png">
Automatic9045さんの回答で上記のような例を挙げられていますが、ここでのa.pngというのは
例として挙げられたもので、aという名前の.pngという拡張子が付いているのでpngファイル
という事です。あくまで、a.pngは質問者さんが使用したい画像ファイルを指定する必要があります。
指定する際に画像ファイルがどこに配置されているか、それを指定するために絶対パスと相対パスという
ものを使います。
下記に参考サイトを載せておくのでご一読ください。
【初心者向け】絶対パスと相対パスの違いについて解説
投稿2021/04/05 04:54
総合スコア1282
0
おはようございます。
いくつかの可能性があります。
1. パスが間違っている
試しに表示したい画像をHTMLファイルと同じフォルダに入れてみて下さい。
そして、例えばその画像がa.pngという名前であれば
HTML
1<img src="a.png">
としてみて下さい。表示されましたか？
2. 画像ファイルが破損している
手順1で改善されなかった場合は、画像ファイルが破損している可能性が高いです。
画像の拡張子を直接ファイル名変更から変更したりしていませんか？
表示させたい画像を「名前をつけて保存」で保存し直してみて下さい。
投稿2021/04/05 01:11
総合スコア313
1. で解決できた場合のための補足です。
HTMLファイルと同じフォルダにimagesというフォルダを作り、その中に画像ファイルを入れた場合、
<img src="images/a.png">
となります。
imagesの中にさらにcategory1というフォルダを作って画像ファイルを入れた場合、
<img src="images/category1/a.png">
となります。
もちろん、フォルダの名前は自由に変えられます。
ここまで来ればパスについてはもうわかるでしょう。
0
<img src="images/〜">
で画像を取り込めると思うのですが、
正確には違います。
srcの中は「実際に画像を置いた場所」を記載します。既に回答にある「パス」は「場所を指し示す文字列」のことです。
あとは「相対パス」「絶対パス」という考え方は理解しておくべきものですが、実際においた場所を指定するのでimagesというディレクトリが存在しない、もしくは存在しても現在アクセスしているURLから正しく参照できるパスになっていない（相対パスの場合に多い）
のであればimgタグは正しくファイルを参照できないので表示できません。
「srcにはファイルを置いた場所を書く」を念頭にコードと場所の関連性を見直してみてください。
これは「定義したものを使う」となるので他の言語や場面でも活きてきます。
投稿2021/04/05 01:55
総合スコア80861
あなたの回答
tips
プレビュー
