2011-09-11 57 views
3

我想嘗試並獲得跨瀏覽器漸變效果與rgb價值與回退瀏覽器不支持它的情況下。CSS3交叉瀏覽器漸變背景與rgb/rgba和回退

的jsfiddle例如:http://jsfiddle.net/HelloJoe/hUxdh/

我相信我已經覆蓋了大多數瀏覽器,但我有幾個問題:

  1. 是否有哪些常用的,我已經錯過了任何其他瀏覽器,以及諸如iPad /智能手機等設備需要哪些屬性,還是會從當前使用的某個屬性渲染?

  2. 如果偶然梯度不呈現,是否有原始background: rgb(50, 50, 50);足以生成一個純色?

  3. 隨着filter價值,我無法得到它通過使用rgb值工作,不得不求助於使用hex值來代替,而不是這是一個巨大的問題,但我想只能用rgb值。有沒有辦法解決這個問題,或者只是不接受他們?

  4. 如果我是使用rgba代替rgb將我然後需要有一個rgba梯度背景值,rgb梯度背景值作爲回退不渲染alpha透明度,然後固體背景回落的情況下沒有漸變渲染?或者,瀏覽器會忽略alpha透明度值,只顯示來自rgbargb,而沒有單獨的rgb背景回落?

  5. 作爲所有事情的最終回退,在CSS屬性開始時會有一組值爲hex的值嗎?我猜想沒有什麼壞處,只是增加了一個hex的值,但使用rgb的想法是,如果rgba可用,它可以在整個網站上快速簡單地改變顏色。因此,如果返回hex的值,將會使我使用rgb/rgba毫無意義,因爲我需要通過並編輯所有hex值。

我已經做了一些搜索和實例不同,理解不同的是人與人之間的誤解,我只是在嘗試創建得到想要的結果的準確工作示例。

回答

6

可能我建議你這個網站,以幫助你與你的漸變和回退:
http://www.colorzilla.com/gradient-editor/

+0

這肯定是一個了不起的發電機,非常感謝你西蒙!有幾個問題仍然存在,比如瀏覽器不讀取'rgba',它只是讀取'rgb'值並忽略alpha透明度?還有一個「十六進制」的價值需要作爲最終的回落? – Joe

+0

@JoeMottershaw我對Colorzilla的終極漸變編輯器的愛不能被衡量,所以(+1),但根據情況可能你想使用其他東西,如圓角和陰影,我只是要扔在http:// www。 css3pie.com - 請注意,網站本身是一個演示陰影和圓角如何工作。 – Joonas