2016-07-17 5 views
0

これは私の最初の質問です(そして最初の投稿)。私が十分に熟練すれば、もっと貢献したいと思っています。CSSバックグラウンド画像のみがインラインで動作する

とにかく、自分のhtmlとインラインであるcssを使用して参照すると背景画像が表示されるのはなぜか分かりませんが、HTMLリンクとは別のcssスタイルシートに配置すると表示されません。

はここで正常に動作され、同様に私のインラインCSSが見えるものです:

<style> 
    body { 
     background: url('background.jpg') center center fixed; 
     background-size: cover; 
    } 
</style> 

マイStyles.cssをファイルは正確に同じコードが含まれて、次のようになります。

<style> 
 

 
\t body { 
 

 
\t \t background: url('background.jpg') center center fixed; 
 
\t \t background-size: cover; 
 
\t } 
 

 
\t p { 
 

 
\t \t font-family: 'Helvetica Neue' Helvetica; 
 
\t \t font-color: white; 
 

 
\t } 
 

 
\t h1 { 
 

 
\t \t color: white; 
 
\t \t font-family: 'Helvetica Neue'; 
 
\t \t font-size: 3.5em; 
 
\t \t text-align: center 
 
\t } 
 

 
\t .textbox { 
 

 
\t \t background-color: beige; 
 
\t \t height: 100px; 
 
\t \t width: 100px; 
 
\t \t padding: 10px; 
 
\t \t margin: 50px auto; 
 
\t \t text-align: center; 
 
\t \t font-family: 'Helvetica Neue' Helvetica; 
 
\t \t font-weight: 200; 
 

 
\t } 
 

 

 
</style>

...しかし、背景画像は表示されません。 CSSファイル(段落の書式設定、テキストサイズ/色など)のすべてがブラウザに表示されます。

また、htmlファイル、CSSファイル、および背景イメージはすべて同じディレクトリにあります。だから私は "/ background.jpg"、 "../background.jpg"など、私はStackoverflow上の他のポストの他のケースで示唆してきたなどを使用する必要はないと思った。

私はこれに対する答えを見つけようとしましたが、見つけられませんでした。どんな助けでも大歓迎です!

+0

styles.cssには正確に何が含まれていますか? –

+0

こんにちは、このコミュニティでもっと多くの人を見て、このサイトを読んでみてください。http://www.w3schools.com/css/css_howto.asp – thefailtheory

答えて

3

しかし、別の.cssファイルで、私が使用してHTMLファイルにそれにリンクし、上記のように正確に同じコードを入力:

あなたから<style> & </style>タグを削除しましたCSSファイル?たとえば、次のようになります。

body { 
    background: url('background.jpg') center center fixed; 
    background-size: cover; 
} 

これらのHTMLタグは、CSSをHTMLに直接組み込む場合にのみCSSルールの周りに必要となります。

+0

それはトリックでした!あなたの明確な説明をありがとう! –

0

あなたのファイルとフォルダの構造を参照する必要があります。あなたが参照しているスタイルシートがHTMLと同じフォルダにあることを確認します。同じコードがあれば..あなたはCSSのような別のフォルダにありますあなたは

フォルダ構造を../image.pngのようなものへのリンクだけでなく、スタイルシートのhrefを変更する必要がありますよりも、CSS/Styles.cssをここに

0

重要あなたのうちのスタイルのタグを取ります。 CSSファイル。

関連する問題