Q&A
その「画像のように」の画像を提示してください。
またコードはマークダウンのcode機能を利用してご提示ください
htmlで、次のように書いているのですが、画像が表示されません。
画像ファイルとhtmlファイルの位置関係は画像①のようになっています。
画像①
画像②
html
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5ああああああ 6<button> 7<small>menu</small> 8</button> 9</head> 10 11<body> 12あああああああ 13<img src="dt.PNG"> 14</body> 15</html>
よろしくお願いします。
htmlと画像は同階層にあるんでしょうかねぇ。
どっちにしろ位置関係画像を貼っていただかないとなんともいえませんね
ローカルで確認しているのでしょうか？
画像ファイルを直接ブラウザで開くと表示されますか？
画像ファイル、直接ブラウザで開けます。
HTMLでどう表示されているかも、キャプチャ画像はっつけてもらった方がいいかと。
何が今のままだと、HTMLの書き方に問題はなさそうなので、画像が壊れてるのかもしれないですが、階層だけだと判別できないので。
確認ですが、ファイルの拡張子は正しいですか？ フォルダーを表示した画像が示されていますが、画像ファイルの拡張子は大文字（.PNG)、HTMLファイルの拡張子は小文字（.html)というように統一されていない事が気になります。大文字と小文字の違いでファイルが見つからないエラーが起きないように、ファイル名を付ける際の統一ルールを作り、守るべきだと思います。
coco_bauerさんのおっしゃる通り、ファイル名は、ファイルのプロパティなどで確認した方がいいかも。
ファイルの拡張子を非表示にしていて、本当は、dt.PNG.pngなのに、エクスプローラー上で、dt.PNGと表示されてるだけだったりするかもしれません。
画像に名前出ちゃってますが大丈夫ですかね？
私は、「htmlで画像が表示されません」というタイトルから、Webサーバ上にあるHTMLファイルをPC(クライアント）で動作しているWebブラウザで表示しようとしているのだと思いました。しかし、先ほど短時間だけ表示された"画像②"では、表示対象はローカルファイル（"file:"で始まるURL)で、Webサーバへのアクセス("http"で始まるURL)ではありませんでした。
私には『何をしようとして、何に困っているのか』が判らなくなったのですが、具体的に説明して頂けませんか？
x_xさん
大丈夫じゃなかったです。有難うございます。
coco_bauerさん
htmlで画像付きのページを作成しようとしました。
NotepadXというテキスト編集アプリでコードを書き、html形式で保存したのちに、そのファイルをダブルクリックで開きました。
そうすると表示されるよ思っていた画像が表示されず、困っている、といったところです。
からきし初心者で、用語もままならず、すみません、、
ちなみに履歴はのこっていて、そこから画像は見れるので削除依頼をしたほうがいいかもね
回答2件
0
ベストアンサー
まず、htmlの書式を正しましょう。
head要素の中には、
生のテキスト、各種body内に入る要素は全てNGです。
ただ、これで解決するとは考えにくいです。
どうやら、Microsoft Edgeで表示されているようなので、
Edgeでは、headが間違っていると、
その後のHTMLの表示に不都合が生じるのかも。
確認はしていないです。すみません。
html
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5<title>ページタイトル</title> 6<meta name="keywords" content="キーワード01,キーワード02"> 7</head> 8 9<body> 10あああああああ 11<img src="dt.PNG" width="画像の横幅" height="画像の縦幅"> 12</body> 13</html>
画像の横幅、画像の縦幅の部分には、しっかりと、画像のサイズに合わせた、半角数字をいれてください。
（数字のみにする。pxなどはいれない）
また、IE11では、
ローカルHTML上でのローカルファイルへのアクセスに制限をかけているようです。
（下記エントリー参照）
IE11でローカルホスト上の画像が表示されないときの対処方法 – とろテク
IE11とEdgeは、仕様が同じものが、ところどころに存在するので、
Edgeだけ表示できないのなら、
これが原因の可能性は非常に高いです。
投稿2019/02/06 08:37
編集2019/02/07 01:57総合スコア9528
有難うございます。
コピペして半角数字入れて試してみたのですが、表示されませんでした、、、
もしや、これでは？？
https://wp2.trojanbear.net/2194.html
記事の件はIE11ですが、
おそらくEdgeも同じ仕様のはずです。
上記コメント内容を、回答に追記しました。
ご確認と試行をお願いします。
解決しました！有難うございます！
0
HTML
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5ああああああ 6<button> 7<small>menu</small> 8</button> 9</head> 10 11<body> 12あああああああ 13<img src="dt.PNG"> 14</body> 15</html>
パス
再現結果
まったく同じようになるようにやってみましたが画像表示されちゃいました・・・。
投稿2019/02/06 08:08
総合スコア2341
確認してほしいこと
●キャッシュのクリア（念のため）
●別ファイルでPNGファイルを保存しても画像は表示されないままか
例）イラストで適当に絵をかいて同名でPNGファイルで保存
（私のやってみたほうは PNGイメージで、質問者さんの画像はPNGファイルっていうくらいしか差異がないのでこれでできなければお手上げです私は）
画像は別ファイルを自分で拡張子にPNGつけて変換したもの、とかじゃないですよね
自分で.PNGをつけた、とかではないです。
MicrosoftEdgeのキャッシュを消去して、イラストで適当に描いたpngファイルで試してみても、出来ませんでした。。
エンコードをANSIからUnicodeに変換したんですが、それは関係ないですかね、、？
今Unicodeで保存して試してみましたが画像表示されちゃいました。
Edgeで表示しているようですが、他のChromeなどのブラウザではどうですか？
Chromeだと表示されました。他のブラウザでもよく見ると表示はされているようなのですが、画像が透明になってしまっており、見えません。
Edgeのバグかもしれませんね・・・。
他の方が回答してくださっているように、htmlの構文がまちがっているところがあるので、
そこを正しく治してみるくらいしかもう思いつきません。
htmlファイルのプロパティをいじると解決しました！ご回答ありがとうございました。
あなたの回答
tips
プレビュー
