置顶公告:【置顶】关于临时开启评论区所有功能的公告(2022.10.22) | 【置顶】关于本站Widget恢复使用的公告
  • 你好~!欢迎来到萌娘百科镜像站!如需查看或编辑,请联系本站管理员注册账号。
  • 本镜像站和其他萌娘百科的镜像站无关,请注意分别。

Template:渐变发光/doc

贴贴♀百科,万娘皆可贴的百科全书!转载请标注来源页面的网页链接,并声明引自贴贴百科。内容不可商用。
跳到导航 跳到搜索

本模板用于实现文字的渐变外发光效果,用户可以设置外发光的颜色渐变方向、设置多层渐变颜色、设置外发光的宽度。

简介

本模板叠加两层文本,将下层文本以类似{{Gradient Text}}的方式形成渐变色后将其模糊化,以实现文字的渐变外发光效果。

由于目前的浏览器中,实现了background-clip:text属性的只有Edge和Webkit内核(Chrome,Safari,Android自带浏览器,国产双核浏览器的极速内核)的浏览器可以解析并显示出效果。IE、Firefox 49以下显示效果则是还原为原始的黑色字(Firefox 48可以打开about:config,把layout.css.background-clip-text.enabledlayout.css.prefixes.webkit改为true以查看效果)。

由于本模板使用了多层文本,在嵌套使用时强烈建议将其他模板置于此模板外层,否则会导致展开长度超级加倍。

  • 本模板使用了模板样式表,请勿将其直接展开后用于签名。

参数

序号 参数名 说明 默认值
1 content 文字内容
2 FontColor 文字颜色 #FFF(白色)
3 GradientColor 渐变代码,具体用法可见{{Gradient Text}} left,blue,red(从左到右、从蓝色渐变为红色)
4 GlowSize 外发光尺寸(即底层模糊度),单位为px 4
5 CSS 额外的CSS样式,在这里填写可以减小展开长度

使用示例

代码 效果
{{渐变发光|content=从左到右的三色渐变|FontColor=white|GradientColor=left, #F37A93, #90ACF3, #F1D788|GlowSize=5}}
从左到右的三色渐变从左到右的三色渐变从左到右的三色渐变从左到右的三色渐变从左到右的三色渐变从左到右的三色渐变
{{渐变发光|从左下到右上的<br>蓝紫红黄四色渐变|white|45deg, blue, purple, red, yellow|5|font-size:1.2em;font-weight:bold}}
从左下到右上的
蓝紫红黄四色渐变从左下到右上的
蓝紫红黄四色渐变
从左下到右上的
蓝紫红黄四色渐变
从左下到右上的
蓝紫红黄四色渐变
从左下到右上的
蓝紫红黄四色渐变
从左下到右上的
蓝紫红黄四色渐变

相关模板