CSSを使用して背景画像が表示されない

画像を背景として表示してページをカバーするようにCSSに書き込もうとしています。CSSを使用して背景画像が表示されない

私は、CSS/varPractice.css

body { 
background-image: url("img/beautifulPic.jpg"); 
background-size: cover; 
background-image: no-repeat; 
}

として保存され、次のコードを使用して、私のHTMLドキュメントに次の行を持っています。

<link rel="stylesheet" href="css/varPractice.css">

しかし、写真は全く表示されません。これは、そのHTMLファイル内の唯一のスタイルシートリンクです。

アドバイスはありますか？

出典

2017-05-09 Rob Hudson

私の問題は私のイメージではなく、CSS内のメインディレクトリのフォルダのIMGであったことを実際にだった - >のimgフォルダ、コンソールは、ディレクトリが「wasn私に言いました見つけた私はプログラミングに慣れていないので、練習と楽しみのためにいくつかのページを角括弧で書きます。私はフィードバックがうまくいけば、それは正常に動作したファイルパスを修正し、私はbackground-repeatをbackground-repeatに切り替えましたが、このインスタンスではどちらの方法も繰り返されませんでした。 –

より良い習慣は、CSSのフォルダを作成する習慣に入る。あなたが進歩するにつれて、数多くのスタイルシートを使用しているかもしれません...今すぐ始めましょう！（フォルダを使用して.. ..）:) –

背景イメージを削除してみます。バックグラウンドリピートする必要があります。背景イメージを上書きしていました。

出典

2017-05-09 21:48:12

background-imageを再宣告しました。 background-repeatを使用したようです。

次のようにあなたのルールは次のようになります。

body { 
    background-image: url("img/beautifulPic.jpg"); 
    background-size: cover; 
    background-repeat: no-repeat; 
}

出典

2017-05-09 21:49:15

ジョセフ、ありがとう、CSSのバックグラウンドの画像を追加するとき、URLは自動的にCSSと同じフォルダを検索しようとしますか？これは正しいです？ –

@RobHudson使用するパスによって異なります。あなたが今持っているもので、そうです、それはそのように振る舞います。（スラッシュやhttpやhttpsなどのプロトコルで始まらないパス）は、スタイルシートとの相対パスになります。絶対パスの使用を強くお勧めします。あなたの場合、おそらく '/ img/beautifulPic.jpg'となるでしょう。これにより、リソースがサイトルートに対して相対的にロードされることが効果的に保証されます。 –

CSSを使用して背景画像が表示されない

答えて

関連する問題