-1

html タグで背景 Web サイトに背景画像を追加する際に問題が発生しています。問題はここにあります：

html{
background:url('assets/img/jp-logo.png'); /*background image*/
background-image:url('assets/img/jp-logo.png'); /*background image*/
-webkit-background-size: cover;
-moz-background-size: cover;
}

背景サイズと一緒に機能するかどうかをテストするため、背景と背景画像の両方を入れました：カバーですが、どれも機能しませんでした。ファイルのディレクトリ パスも確認しましたが、これも問題ありません。なんでこんなはずじゃないんだろうと思っていました。私は別のhtmlとcssのテストシートでそれをテストしましたが、うまくいきましたが、なぜここで疑わしいのでしょうか。完全なコードはこちら: http://jsfiddle.net/TheAmazingKnight/kjLg8/

私が作ったこの短いサンプルはうまくいきました：

<!doctype html>
<html lang="en">
<head>
    <title>Test Page</title>
    <link rel="stylesheet" href="test.css" type="text/css" media="screen" /> <!--CSS for desktop screens-->
</head>
<body>
    <p>hello</p>
    <img src="jp-logo.png" alt="jp-logo.png" />
</body>
</html>

html{
background-image:url('assets/img/jp-logo.png');
}
4

4 に答える 4

1

背景の写真を変更し、次のように body 要素に配置しました。

body{

    background:url(http://technomarketer.typepad.com/technomarketer//Radiohead_wallpaper.jpg); /*background image*/

-webkit-background-size: cover;
-moz-background-size: cover;

そしてそれはうまくいきました。

そのため、写真 (assets/img/jp-logo.png) へのパスが間違っている可能性があります。

確認しましたか？

于 2013-09-08T01:05:01.673 に答える
0 
html{
background:url("assets/img/jp-logo.png") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

このコードは完璧に機能し、クレジットが必要な場所にクレジットを与えることがわかりました： http://css-tricks.com/perfect-full-page-background-image/

于 2013-12-16T14:27:59.230 に答える