Alat Kecerunan CSS Dalam Talian
CSS Gradient ialah tapak web kecil yang gembira dan alat percuma yang membolehkan anda mencipta latar belakang kecerunan untuk tapak web.
Kecerunan CSS membolehkan anda memaparkan peralihan yang lancar antara dua atau lebih warna yang ditentukan.
CSS mentakrifkan dua jenis kecerunan:
- Kecerunan Linear (turun/atas/kiri/kanan/menjuru)
- Kecerunan Jejari (ditakrifkan oleh pusatnya)
Kecerunan Linear CSS
Untuk mencipta kecerunan linear anda mesti menentukan sekurang-kurangnya dua hentian warna. Hentian warna ialah warna yang anda ingin berikan peralihan yang lancar. Anda juga boleh menetapkan titik permulaan dan arah (atau sudut) bersama-sama dengan kesan kecerunan.
Sintaks
background-image: linear-gradient(direction, color-stop1, color-stop2, ...);
CSS Radial Gradients
A radial gradient is defined by its center.
To create a radial gradient you must also define at least two color stops.
Syntax
background-image: radial-gradient(shape size at position, start-color, ..., last-color);
By default, shape is ellipse, size is farthest-corner, and position is center.
Set Shape
The shape parameter defines the shape. It can take the value circle or ellipse. The default value is ellipse.
The following example shows a radial gradient with the shape of a circle: