背景の画像がエラーで表示されない

前提・実現したいこと

背景に画像が表示される。
プログラミングを最近始めていろんなことを試しています。
background-image: urlを使って背景を変えようとしてますが、
実装中に以下のエラーメッセージが発生しました。

発生している問題・エラーメッセージ

エラーメッセージ

Failed to load resource: net::ERR_FILE_NOT_FOUND　sofia-lupi-v-57aQ_IRNs-unsplash.jpg:1

該当のソースコード

ソースコード

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="part-img"> </div> <h1><div> プログラミング学習 </div></h1>

<hr>
<main>
 JAVASCRIPTについて学ぼう   
</main>

<article> JavaScriptとは、プログラミング言語のひとつである。JavaScriptはプロトタイプベースのオブジェクト指向スクリプト言語であるが、クラスなどのクラスベースに見られる機能も取り込んでいる。 </article> <a href="https://www.javadrive.jp/javascript/">URL</a> </body> </html>

{color: brown;}

.part-img{
background-image: url(file:///C:/Users/mini/Downloads/sofia-lupi-v-57aQ_IRNs-unsplash.jpg);
background-size: contain;
background-position: center;
}

試したこと

この他にも　unsplash sourceのhttps://source.unsplash.com/randomを使うときにはどのようにすればいいですか教えてください。
ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

m.ts10806

2020/03/26 11:48

質問は編集できますコードのマークダウン対応ができてません。 ```言語名コード ``` です。あと >この他にも当質問解決後に、別質問にしてください。

行動規範の内容に同意します

回答1件

ベストアンサー

Failed to load resource: net::ERR_FILE_NOT_FOUND　sofia-lupi-v-57aQ_IRNs-unsplash.jpg:1

太字にしたように「ファイルが見つからない」
＝正しくコード（HTMLやCSS）から正しく参照できない

ことを意味します。
いわゆる「パスが合っていない」というものです。

合わせてください、、、としか言いようがないのですけど、
合わせてください。

基本はその記述があるファイルから参照できるように書くことです。
相対パス、絶対パス　どちらでも構いませんが
file:///C:/ ←これだとWindowsのPCにファイルを、同じフォルダ構成になってる人しか参照できません。
ひとまず、相対パスで調整するのが手っ取り早いでしょう。
その記述があるファイルからの相対位置で指定してください。

投稿2020/03/26 11:53

m.ts10806

総合スコア80875