2016-12-15 9 views
0

いいえ私は新しい質問を投稿しているので、他の質問にはコメントできません。画像の背景がCSSで読み込まれていない

私はthis答えで提案されているすべての解決策を試しました。答えはthisです。

#head { 
 
    text-align: center; 
 
    font-family: roboto; 
 
} 
 

 
body, html { 
 
    height: 100%; 
 
} 
 

 
.parallax { 
 

 
    background-image: url('.../pics/parallax.jpg'); 
 

 
    height: 100%; 
 

 
    background-attachment: fixed; 
 
    background-position: center; 
 
    background-repeat: no-repeat; 
 
    background-size: cover; 
 
}
<!doctype html> 
 
    <html> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <link rel="stylesheet" href="css/animate.css"> 
 
    <link rel="stylesheet" href="css/text.css"> 
 
    <script src="scripts/jquery-3.1.0.min.js"></script> 
 
    <script src="scripts/jquery.animate-color.js"></script> 
 
    <script src="scripts/custom_scripts.js"></script> 
 
    <title>Yadullah.me</title> 
 
    </head> 
 
    <body> 
 
    <h1 id="head"> Hi there!</h1> 
 
    
 
    </body> 
 
    </html>

非常にシンプルですね。しかし何らかの理由で背景画像が表示されなくなりました。
CSS、HTML、画像を同じフォルダに入れてみましたが、成功しませんでした。別のサブディレクトリで試してみましたが、成功しませんでした。

ファイル名、拡張子、そのすべてをチェックしました。引用符なしで試してみませんか?他の画像を試してみました。他のすべてのCSSファイルも削除しようとしましたが、何も動作しません。

+4

を1つのドットの画像へのパスであまりにも多くあるように見えます.... –

+0

GCyrillusさんのコメント、 'URL(」について詳しく説明するには... /残念ながら、それはどちらもうまくいきませんでした – Santi

+0

@ 。あなたのCSSファイルは、検索しようとしているイメージに関連してどこにありますか? –

答えて

3

あなたのスタイルプロパティにはいくつかのストップがあります。あなたのCSSは次のようになります。

.parallax { 
    background-image: url('../pics/parallax.jpg'); 
    ... 
} 
+0

試しました。 did not work –

+0

あなたのCSSファイルの名前は何ですか?そしてそれはどのフォルダにありますか? –

+0

これはcssという名前のフォルダにあります。ファイル名はtext.css –

0
#head { 
    text-align: center; 
    font-family: roboto; 
} 

body, html { 
    height: 100%; 
} 

.parallax { 

    background-image: url('.../pics/parallax.jpg'); // In Here try put absolute URL or change .../ in ../ 

    height: 100%; 
width:100%; //and try add width 
    background-attachment: fixed; 
    background-position: center; 
    background-repeat: no-repeat; 
    background-size: cover; 
} 
+0

です。うまくいかなかった –

0
You can try add base tag for example like this 

<!doctype html> 
    <html> 
    <head> 
    <base href="http://YourSite.com/"> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" href="css/animate.css"> 
    <link rel="stylesheet" href="css/text.css"> 
    <script src="scripts/jquery-3.1.0.min.js"></script> 
    <script src="scripts/jquery.animate-color.js"></script> 
    <script src="scripts/custom_scripts.js"></script> 
    <title>Yadullah.me</title> 
    </head> 
    <body> 
    <h1 id="head"> Hi there!</h1> 

    </body> 
    </html> 
関連する問題