漸變漸變？

好的，我不知道這是否可能，只是我的代碼有問題...漸變漸變？

所以，我嘗試在梯度內製作線性漸變？

background: -webkit-linear-gradient(top, #9DB2F0 0%, #9DB2F0 40%, -webkit-linear-gradient(left, red 0%, yellow 100%) 40%)

如果可能的話，請告訴我，如果我做錯了什麼，或瀏覽器是可能的。

2012-06-19 Mobilpadde

@Josh不喜歡我的「Thank you：D」？ – Mobilpadde

不要個人承擔。 [閱讀]（http://meta.stackexchange.com/a/128552/157574） – Sparky

@ Sparky672啊，謝謝 – Mobilpadde

梯度image values，不color values。由於CSS3中的漸變僅使用顏色中止，因此不能像這樣嵌套它們。

你會想要找到一個漸變或圖像編輯器，可以幫助你可視化最終漸變看起來像什麼（因爲我不知道你想要它看起來像什麼），並可能會產生相應的單線性漸變爲你。

從我看到的，雖然，它看起來像一個多方向的梯度。在這種情況下，您要麼使用layered backgrounds（每層只有一個漸變），要麼使用實際圖像。

2012-06-19 17:43:28 BoltClock

http://www.colorzilla.com/gradient-editor/ <<我認識的最好的一個 –

@真相：是的，那是我正在尋找的那個，但忘記了這個鏈接。謝謝！ – BoltClock

使用'background-image'而不是'background'應用漸變時，這種區別更加清晰。 –

只是增加@BoltClock回答一些技巧，你可以玩：

層次的背景，因爲他在他的回答說。它完成了多個背景「圖像」（漸變）。每個人都可以通過以下方式進行控制：
```
background-position: left center, right top; 
background-repeat: repeat, no-repeat; 
```
如果你有2個圖像/漸變你想要的風格。
漸變添加到:before和:after pseudos。你可以在你想要的位置放大和放置這些僞碼（你必須：絕對定位，z-index將它們在主背景和實際內容之間分層）。例如，請參閱我的以前的答案和小提琴：Showing two different gradients as a background using CSS?

似乎你不能通過content: url() url()添加漸變，只有圖像（任何有效的url（）值）。而且，通過content添加的內容不能作爲真實背景（重複，位置）進行控制，因此即使它工作，它也不是最通用的方法。

2012-06-19 18:14:56 FelipeAls

回答