Template:Gradient Text/doc
Introduction
This is a gradient color text template. Real gradient text using the CSS background-clip:text
property. Instead of the original gradient effect simulated by one text and one color.
Because in the current browsers, only the Edge and Webkit kernels (Chrome, Safari, Android's own browsers, and extremely fast kernels of domestic dual-core browsers) with the background-clip:text
attribute implemented can parse and display the effect. The display effect below IE and Firefox 49 is restored to the original black text (Firefox 48 can open about:config
, put layout.css.background-clip-text.enabled
and layout.css.prefixes.webkit
to true
to see the effect).
Example
Rainbow colored text Soft gradient text
Horizontal gradient
Usage
text
Gradient color code
<position>, <color1>, <color2>, ...
|