本站页面（多半）转载自萌娘百科的同名页面，依CC BY-NC-SA 3.0引入，贡献者可以在历史页查询。
因各种原因页面内容可能和源页面有所出入，非本站特有页面内容请以萌娘百科为准。此外，因萌百的api限制，本站部分页面和图片同步自另一个镜像站。
置顶公告：【置顶】关于临时开启评论区所有功能的公告(2022.10.22) | 【置顶】关于本站Widget恢复使用的公告
  • 你好～！欢迎来到萌娘百科镜像站！如需查看或编辑，请联系本站管理员注册账号。
  • 本镜像站和其他萌娘百科的镜像站无关，请注意分别。

Template:Gradient Text

猛汉♂百科，万男皆可猛的百科全书！转载请标注来源页面的网页链接，并声明引自猛汉百科。内容不可商用。
（重定向自Template:文字渐变色）
跳到导航 跳到搜索
Template-info.svg 模板文档  [查看] [编辑] [历史] [刷新]
这个文档嵌入自Template:Gradient Text/doc。

简介

这是一个真·渐变颜色文字模板。使用CSS的background-clip:text属性实现的真正意义上的渐变色文字。而不是原始的一个文字一个颜色模拟出的伪·渐变色效果。

参考：background-clip | MDN

效果

我是彩虹文字 我是柔和的渐变色文字

横着渐变也可以哦

用法

{{Gradient_Text|渐变色代码|文字内容|title=鼠标悬停在文字上显示的注释}}

渐变色代码

<位置>,<颜色>,<颜色2>, ...

  • 说明：
  1. 渐变色代码由若干个以逗号分隔的颜色（名称或16进制代码）组成。
  2. 位置为可选参数，可以填角度或者方位。

简单的渐变

要确定一个渐变色，至少需要两个颜色。

最简单的渐变色代码就是将两个或者两个以上的颜色用逗号（英文半角）连接起来

代码 效果
{{Gradient_Text|red,blue|我是渐变色文字}} 我是渐变色文字
{{Gradient_Text|red,orange,yellow,green,cyan,blue,purple|更多的颜色也可以}} 更多的颜色也可以

控制位置

如果觉得上面的红色的位置太小，你可以在颜色后面加一个表示位置的百分比数字，这样在这个百分比的点上就会是这种颜色了。

代码 效果
{{Gradient_Text|red 50%,blue|我是渐变色文字}} 我是渐变色文字

控制方向

在颜色前面加上一个限定方向的词就可以控制渐变色的方向。

代码 效果
{{Gradient_Text|left,red,blue|我是渐变色文字}} 我是渐变色文字
{{Gradient_Text|top left,red,blue|这样是斜向的渐变}} 这样是斜向的渐变
{{Gradient_Text|60deg,red,blue|还可以直接输入角度值}} 还可以直接输入角度值

注释文字

|title=可设置鼠标悬停在渐变颜色文字上显示的注释文字。可选参数。

代码 效果
{{Gradient_Text|left,red,blue|鼠标放在这里可以看到注释|title=我是注释}} 鼠标放在这里可以看到注释
 
查 · 论 · 编
格式模板
排版
元素浮动
浮动{{Float}} • 清除浮动{{Clear}} • 修改浮动方向{{Clear2}} • 多行{{Stack}}{{Stack begin}}{{Stack end}} • {{Flex}}
分栏
内联{{Columns-list}} • 多行{{Multicol}}{{Multicol-break}}{{Multicol-end}}
对齐
向下对齐{{Bottom}} • 水平居中{{Center}}
特殊字符
文字连接符{{Wj}}/&#x2060; • 零宽空格{{Zwsp}}/&#x200B; • 不换行空格{{Nbsp}}/&nbsp;
表格
{{Table}} • 单列统一样式{{Table column style}}
书写方向
修改书写方向{{Writing-mode}} • 竖排文本{{VText}} • 竖排页面{{Tategaki}} • 镜像文本{{镜像}}
悬停效果
{{Moe-hover}} • {{Hover}} • {{HoverInline}} • {{Hovers}} • {{TextHover}} • {{PicHover}}
颜色
文字颜色
标准{{Color}} • 链接{{Coloredlink}} • 带颜色的日文{{Cj}}
背景颜色
文字背景色{{Background color}} • 荧光笔效果{{荧光笔}} • {{背景图片区域}}
文字及背景颜色
行内文字颜色{{Color2}} • 自动化彩幕{{彩幕}} • 高亮文字含上标{{高亮文字}}
交叉颜色
阴影
渐变
颜色块
颜色操作
颜色计算{{ColorOps}} • “色相·色度·明度”色彩空间{{Hct}}
格式
字体
Emoji{{Emojifont}}
文字样式
全功能{{Font}} • 边框{{Border}}{{文字框}} • 代码格式化{{Pre}} • 强调{{Text-emphasis}} • 上划线{{上划线}} • 文字描边{{文字描边}} • 文字描边2{{文字描边2}} • 文字外发光{{文字外发光}}{{文字外发光/stroke}}{{渐变发光}}
假样式
{{假黑幕}} • {{假链}} • {{Falselink}} • {{假折叠}}
格式化
不可见0{{0}} • 交替文本{{Crosstext}} • 空格生成/重复文字{{Space}} • 填充空间/占位{{Pad}}{{Padding}} • 小数舍入/补零{{Strformat}}
梗
自动化黑幕 {{黑幕}} • 灰色删除线 {{胡话}} • 模糊文字{{文字模糊}}
注音
Ruby系列
标准{{Ruby}} • 黑幕{{Rubyh}} • 多行{{Ruby-begin}}{{Ruby-item}}{{Ruby-end}} • 单字{{Rubya}} • 简化版{{RawRuby}}
其它
可开关注音{{Photrans}}{{Photrans2}} • 逐词可开关注音{{Photransa}} • {{日本人名}} • 国际音标{{IPA}}
其它
定型文
{{配音表}} • {{提问箱}} • {{UnicodeTable}}
链接及分类相关
内链分类{{Cate}}{{萌点}} • 名字分类{{Catn}} • ISBN链接{{ISBN}} • 隐藏红链{{Link}} • 无标记外链{{Plain link}} • 换色链接{{Coloredlink}} • 链接语言标识{{Languageicon}}
导航框
导航框组件{{Navbox}}{{Navbox subgroup}}{{Navbox with columns}}{{Navbox with collapsible groups}}{{Navbar}} • 大家族简易模板{{大家族}}{{大家族模板子项}}{{大家族内容行}}{{Linksplit}} • 横向列表{{Hlist}}
注释
来源请求{{Citation needed}} • 已故人物{{Dead}}{{已故人物标注}} • 上标{{Supt}} • 分级标志{{游戏分级}}/{{电影分级}} • 适龄提示标志{{适龄提示}} • 引言{{Cquote}}{{Quote frame}} • 附注{{Ps}}
取自“https://moegirl.uk/index.php?title=Template:Gradient_Text&oldid=5750”