多背景css3動畫

我擔心這不能完成，但它是我認爲應該能夠完成的事情。多背景css3動畫

我有一個網頁，其中身體有多個背景（一個是純色，一個是黑色但只有0.2不透明度，第三個是紙張紋理）。這個想法是，根據特定的情況，純色可以改變（使用CSS轉換淡化）。第二層改變不透明度來操縱顏色的黑暗。

問題是這兩個都是獨立完成的，我不知道如何改變背景而不必聲明它們。

例如我定義了這樣的原始背景： background：url（「overlay.png」），rgba（0,0,0,0.3），-webkit-gradient（線性，頂部，底部，從（黑色）到（白色））;

-note我實際上並沒有使用rgba（），因爲這樣做不起作用（Multiple CSS backgrounds, colour over image, ignored），所以我使用了一個可靠的漸變。我希望能夠做到這樣的事情：

background：，rgba（0,0,0,0.6）;; 或 background-2：rgba（0,0,0,0.6）;

這可能嗎？

所以，你有兩個純色和圖像？ –

將多個div彼此放置，並單獨控制它們。

<div class="backgroundlayer1 backgroundlayer2 backgroundlayer3"> 
page in here 
</div>

然後你可以在每一層上單獨工作。

或CSS中使用多個backkground

background-image:url(img1),url(img2);

最後一個是CSS3和可能缺乏支持

2011-07-21 11:48:25

這就是我正在做的 - 只是想知道你是否應該這樣做，因爲它似乎馬虎和黑客 - 當你只針對現代瀏覽器，你不應該做的事情。 –

如果你只想要一個div，你可以編寫class =「backgroundlayer1 backgroundlayer2 backgroundlayer3」 –

回答