Webkit漸變語法

Question

我一直在閱讀關於-webkit-gradient屬性，我不理解它。

徑向：

-webkit-gradient(radial, 105 105, 20, 112 120, 50, from(#ff5f98), to(rgba(255,1,136,0)), color-stop(75%, #ff0188)), 

是什麼105 105, 20, 112 120, 50意思？

線性：

background: -webkit-gradient(linear, 40 50, 50 50, color-stop(0.0, yellow), 
      color-stop(0.5, orange), color-stop(1.0, red)); 

是什麼40 50, 50 50意思？

Answer 1

Webkit gradient documentation

對於徑向漸變，前兩個參數表示開始圓與原點（X0，Y0）和半徑R0，以及接下來的兩個參數表示末端的圓與原點（X1，Y1 ）和半徑r1。

所以對於徑向：「105 105，20，112 120，50」，這是一個圓開始105px左和105px頂部20像素的半徑和在圓112px左結束和120像素頂部具有半徑50px;

對於線性：「40 50，50 50」，在40px左邊開始50px頂部，並繼續向左50px頂部50px。