Sjabloon:Radial-gradient
Uit Theowiki
Use within a CSS style tag. The template uses the background-image property.
<div style="{{radial-gradient | position | shape [size] | #color [stop], #color [stop][, #color [stop], ...] }}">Lorem ipsum...</div>
- position – Mandatrory. Specify the X and Y position of the center of the gradient. This can be any valid CSS position value.
- shape – Mandatory. Specify the shape of the gradient using keywords or CSS size values. Valid keywords are:
- ellipse
- circle
- size – Optional. Specify the size of the radial using keywords or CSS size values.note 1 Valid keywords are:
- farthest-corner; Extends the radial to the farthest element corner, ensuring the gradient covers the entire element. This is the default.
- closest-corner; Extends the radial to the closest corner.
- farthest-side; Extends the radial to the farthest edge.
- closest-side; Extends the radial to the closest edge, ensuring the gradient does not extend beyond the element's borders.
- color – The first two colors are mandatory. You can define any number of additional colors, separated with commas.
- stop – Optional. You can specify a stop position for each color using a percentage (e.g. 45%) or pixels (e.g. 60px).
