改變只是一個網頁上的背景

所以我有下面的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; 
    }

我的問題是，我可以有一個頁面上的背景圖片可以說指數。 HTML和另一個背景圖像爲我的其餘頁面？

來源

2013-03-29 user2189151

你可以做到這一點是通過各種方式，一個簡單的方法是適當地給一個根元素和樣式一個類。僅供參考，我會用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-29 05:55:47

我也喜歡身體，尤其是因爲Modernizr的在html標籤上使用類。 –

添加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-29 05:54:02 Sowmya

將您只添加到該網站的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-29 05:54:16

你可以使用，而不是直接去爲html選擇一類：

.blue 
{ 
    background: blue; 
}

然後調用它像這樣：

<html class="blue">

來源

2013-03-29 05:54:55 Xenolithic

改變只是一個網頁上的背景

回答

相關問題