0

複数の背景画像を作成したいのですが、何らかの理由でうまくいきません。オンラインでグーグル検索し、YouTube でいくつかのチュートリアル ビデオを見ました。チュートリアルの指示に順を追って従いましたが、なぜうまくいかないのかわかりません。

ドリームウィーバーCS6を使用しています。

これが私のコードです：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1
<style type="text/css">
body
{ background: url(images/navi-bg.png) repeat-x 0 85px, url(images/gplaypattern.png) repeat;

}
</style>
</head>
<body>
</body>
</html>

画像へのリンクは次のとおりです。

ここに画像の説明を入力

ここに画像の説明を入力

最初の画像に backgound-repeat: repeat-x backgound-position (x): 0 backgound-position (y)85px を持たせたい

2 番目の画像を繰り返す必要があります

4

3 に答える 3

1

このjsFiddle Linkを見てください - http://jsfiddle.net/nFPLN/

<style type="text/css">
    body { 
        background: url('http://oi48.tinypic.com/23vyd6g.jpg'),
        url('http://oi46.tinypic.com/oucxky.jpg');
        background-repeat: repeat-x, repeat;
    }
</style>
于 2013-03-08T07:46:02.117 に答える
1

ここに、html と head タグがなく、doctype を閉じるのを忘れた解決策があります

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html>
 <head>
 <style type="text/css">
 body
 { background: url(http://i48.tinypic.com/23vyd6g.png) repeat-x 0 85px, url(http://i46.tinypic.com/oucxky.png) repeat;

 }
 </style>
 </head>

 <body>
 </body>
 </html>
于 2013-03-08T07:41:56.360 に答える
1

アイデアはこれです、これでコードを変更してください

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <style type="text/css">
body {
    background-image: url(images/navi-bg.png), url(images/gplaypattern.png);
    background-repeat: no-repeat, no-repeat;
    background-color: transparent, transparent;
}
</style>
 </head>

 <body>
</body>
</html>
于 2013-03-08T07:42:17.133 に答える