2011-08-01 11 views
0

私はさまざまなオプションを試してみましたが、stackoverflowに投稿しました。しかし、何も動作していないようです。私は/ public/imagesにlogo.pngファイル、stylesheetにcustom.cssファイルを持っています。ROR:全画面の背景画像

私は多くのことを検索した後、以下を試してみましたすべてのページの背景が

を(フルスクリーン)logo.pngすることにしたいです。しかし、私は何も得ていない。背景は空白です。

body{ 
background: url('../images/logo.png') repeat-x ; 
text-align:center; 
color:#fff; 
} 
+0

ブラウザでナビゲートすれば画像が見えますか?たぶんそれはルートか権限の問題です。 – Mischa

+0

'url( '/ images/logo.png')'を試してください。 – RocketR

答えて

0
あなたは間違いなく、結果

<html> 
<head> 
<style type="text/css"> 
body { 
    color: white; 
    background:url('paper.gif') repeat-x; 
} 
</style> 
</head> 

<body> 
<h1>Hellos World!</h1> 
</body> 

</html> 
を次のリンク http://www.w3schools.com/css/tryit.asp?filename=trycss_background-imageを使用して、以下のコードを貼り付けし、何が起こるか見て、その後、繰り返し-Xを削除して、参照理由を繰り返し-X を説明するために使用したくない

repeat-xを削除した後にイメージが表示されない場合は、パスの問題(他の箇所が既に指摘しているように)や画像が悪い可能性があります。

他の唯一のことは、本体のテキストに設定した背景のプロパティを上書きする、あなたのCSSに定義されている他のクラス/ divがある場合です。他の人はあなたが火薬虫を使うことを提案しています。私は全面的に心から同意する必要があります。 Firebugは、HTMLとCSSの問題を扱う際には非常に重要です。

FirebugはChromeブラウザとFirefoxブラウザ(Firefoxはプラグインとして、デフォルトではChrome)で使用できますが、他のブラウザではわかりません。

0

代わりのrepeat-xrepeatを置くを助けてください。 画像へのパスが正しいかどうかのチェック以外は、

+0

これはうまくいきません。画像ファイルは/ public/images /にあり、CSSファイルはpublic/stylesheets /にあります。だから私はパスが正しいと思います。 – Wasi

+0

正しいパスである必要があります@はいCSSはきれいですか? –

+0

あなたのCSSはきれいですか?これは、あなたが背景を変える唯一の場所ですか? HTMLにハードコードされたCSSがないかどうかも確認してください。または、最高の状態で、firebugがどのような価値を持っているかを確認してください。 –

0

パスの問題? ^^

あなたがそれに移動するだけであなたのイメージを見ることができますか?問題が何かを見て簡単に解決するには、firebugを使用しないでください。

フルスクリーンの背景画像:

は私が役に立つかもしれCSSトリックで興味深いarticleを見つけましたが、著者はいくつかのソリューションを提供しています。

0

フルスクリーンの背景画像に使用したJQueryプラグインがあり、bgStetcherと呼ばれています。背景画像を伸ばして画面を埋めることができます。そのようなことはCSSではできません。