Template:Rainbow text

来自魔学
W​(留言 | 贡献)2023年4月1日 (六) 19:45的版本 (创建页面,内容为“<includeonly><templatestyles src="Rainbow text/styles.css" /><{{{tag|span}}} class="rainbow-text-{{{type|gradient}}}" style="{{#ifeq:{{{type|gradient}}}|gradient|-webkit-background-clip:text;background-clip:text;background-size:{{{rainbow-size|500%}}} 100%;}}animation-duration:{{{duration|3s}}};{{{css|}}}">{{{1}}}</{{{tag|span}}}></includeonly><noinclude>{{Documentation}}Category:格式模板Category:使用模板样式的模板</noinclude>”)
(差异) ←上一版本 | 最后版本 (差异) | 下一版本→ (差异)
模板文档  [查看] [编辑] [历史] [刷新]
实验性功能,请勿滥用
本模板的gradient模式仅在版本较新的浏览器上有效。

本模板可以生成彩虹动画效果的文字。参考{{Gradient Text}}。

用法

{{Rainbow text
|1=内容
|tag=元素标签,默认为span
|type=渐变模式,gradient(动态渐变,默认)或color(颜色渐变)或background(背景渐变)
|rainbow-size=彩虹宽度,默认为500%(仅在type=gradient时有效)
|duration=动画时长,默认3s,单位为s或ms
|css=额外CSS
}}

示例

{{Rainbow text|Nyanyanyanyanyanyanya!}}

Nyanyanyanyanyanyanya!

{{Rainbow text|type=color|duration=1s|css=font-size:2em;|Nyanyanyanyanyanyanya!}}

Nyanyanyanyanyanyanya!

{{Rainbow text||tag=div|rainbow-size=200%|css=background-clip:unset;-webkit-background-clip:unset;height:1em;}}
{{Rainbow text||tag=div|type=background|duration=5s|css=height:1em;}}