Internetinis CSS gradiento įrankis
CSS gradientas yra linksma svetainė ir nemokamas įrankis, leidžiantis sukurti svetainių gradiento foną.
CSS gradientai leidžia rodyti sklandžius perėjimus tarp dviejų ar daugiau nurodytų spalvų.
CSS apibrėžia dviejų tipų gradientus:
- Linijiniai gradientai (eina žemyn/aukštyn/kairėn/dešinėn/įstrižai)
- Radialiniai gradientai (apibrėžiami pagal jų centrą)
CSS linijiniai gradientai
Norėdami sukurti linijinį gradientą, turite apibrėžti bent du spalvų stabdžius. Spalvų sustojimai yra spalvos, kurių perėjimus norite perteikti sklandžiai. Taip pat galite nustatyti pradžios tašką ir kryptį (arba kampą) kartu su gradiento efektu.
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: