1

したがって、すべてのWebページに背景画像を設定する次のcssコードがあります

  html { 
   background: url(../index/images/white.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
   }

私の質問は、1 つのページに背景画像、たとえば index.html と残りのページに別の背景画像を設定できますか?

4

4 に答える 4

4

これはさまざまな方法で実行できます。簡単な方法は、クラスをルート要素に与え、適切にスタイルを設定することです。参考までに、背景のbody代わりに使用します。html

CSS

body { 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
body.home {
    background: url(../index/images/white.jpg) no-repeat center center fixed; 
}
body.product-list {
    background: url(../index/images/another-image.jpg) no-repeat center center fixed; 
}

index.htm

<body class="home">
    ...
</body>

productList.htm

<body class="product-list">
    ...
</body>
于 2013-03-29T05:55:47.290 に答える
1

html セレクターに直接アクセスする代わりに、クラスを使用できます。

.blue
{
    background: blue;
}

次に、次のように呼び出します。

<html class="blue">
于 2013-03-29T05:54:55.897 に答える
0

internal style以下のようにインデックスページに追加します

<style>
 body { 
   background: url(../index/images/white.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
   }
</style>

また、CSS ファイルの本文は、他のすべてのページに適用されます。

于 2013-03-29T05:54:02.103 に答える
0

そのサイトのその index.html ファイルにのみクラスを追加します。

<html class="home-page">

html.home-page { 
   background: url(../index/images/white.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
   }
于 2013-03-29T05:54:16.707 に答える