如何使徑向漸變與透明度在CSS

Question

我想打一個徑向漸變，其中透明度的變化，我可以得到它的線性而不是徑向

background: -webkit-gradient(linear, left top, left bottom,from(rgba(50,50,50,0.8)), to(rgba(80,80,80,0.2))); 

此代碼的工作線，但是當改變工作

background: -webkit-gradient(radial, from(rgba(50,50,50,0.8)), to(rgba(80,80,80,0.2))); 

停止工作

什麼我需要做的改變這一狀況，各方面的幫助，到目前爲止僅顯示線性漸變

Answer 1

您的語言爲radial-gradient錯誤。

你需要編寫這樣的事： background-image: radial-gradient(ellipse farthest-corner at 45px 45px, rgba(50, 50, 50, 0.8) 0%, rgba(80, 80, 80, 0.2));

檢查MDN docs更多細節。

Answer 2

有一個很好的在線工具angrytools.com，可以幫助您創建具有透明度的徑向漸變。它會爲您爲不同的瀏覽器生成CSS。