这是林泊百科的迁移技术测试站点，所有改动不会同步到林泊百科上，此站点将会在正式迁移后关闭，请勿存放重要数据

模板:Neon：修订间差异

来自Limbo Wiki
跳转到导航 跳转到搜索
←上一编辑
Gaoice​（留言 | 贡献）
行政员、​界面管理员、​premiumuser、​监督员、​管理员、​微件编辑者
52次编辑
可视化wikitext
Gaoice​（留言 | 贡献）
行政员、​界面管理员、​premiumuser、​监督员、​管理员、​微件编辑者
52次编辑
无编辑摘要
标签：（旧）WikiEditor
Gaoice​（留言 | 贡献）
行政员、​界面管理员、​premiumuser、​监督员、​管理员、​微件编辑者
52次编辑
无编辑摘要
标签：（旧）WikiEditor
 
（未显示同一用户的2个中间版本）
第1行： 第1行：
<templatestyles src="Neon/styles.css" /><!--
<includeonly><templatestyles src="Neon/styles.css" /><span class="{{ {{{|safesubst:}}}#switch: {{{mode|}}}
==================================
| auto = neon-auto
  霓虹呼吸灯模板 - Neon Breathe
| hover
  用法:
| #default = neon-item
    {{Neon|text=文字|color=#ff3377|mode=auto}}
    {{Neon|text=文字|color=#00eeff|mode=hover}}
  参数:
    text  = 显示文字（必填）
    color  = 发光颜色（默认 #ff3377）
    stroke = 描边颜色（默认 #fff）
    mode  = hover | auto（默认 hover）
            hover=鼠标悬停呼吸，auto=自动呼吸
    delay  = 动画延迟秒数（仅 auto 模式，可选）
    style  = 额外行内样式（可选）
==================================
--><span class="{{#switch: {{{mode|hover}}}
    | auto = neon-auto
    | hover
    | #default = neon-item
}}" style="
}}" style="
    --glow: {{{glow|{{{color|#ff3377}}}}}};
--glow:{{ {{{|safesubst:}}}#if:{{{color|}}} |{{{color}}}|{{{glow|#ff3377}}}}};
    --font: {{{font|#fff}}};
--font:{{ {{{|safesubst:}}}#if:{{{fontcolor|}}} |{{{fontcolor}}}|{{{font|#fff}}}}};
    --stroke: {{{stroke|#fff}}};
--stroke:{{ {{{|safesubst:}}}#if:{{{stroke|}}} |{{{stroke}}}|#fff}};
    animation-delay: {{{delay|0s}}};
{{ {{{|safesubst:}}}#if:{{{delay|}}} |animation-delay:{{{delay}}};|}}
    {{{style|}}}
{{ {{{|safesubst:}}}#if:{{{size|}}} |font-size:{{{size}}};|}}
">{{{text|{{PAGENAME}}}}}</span>
{{ {{{|safesubst:}}}#if:{{{css|}}} |{{{css}}}|}}
">{{{1|{{{text|{{PAGENAME}}}}}}}}</span></includeonly>
<noinclude>
 
本模板之全部来自用户自定义，依 CC BY-SA 3.0 授权。
<nowiki>{{Neon}}</nowiki> 模板用来生成带霓虹呼吸灯效果的文字，像呼吸一样缓缓明暗变化，支持悬停呼吸和自动呼吸两种模式。
 
== 语法 ==
<pre>
{{Neon|文字|color=颜色|fontcolor=颜色|stroke=颜色|mode=模式|delay=时间|size=字号|css=样式}}
</pre>
 
== 参数 ==
; 1 或 text : 文字内容（必填）
; color 或 glow : 霓虹发光颜色，如 <code>#ff3377</code>、<code>#00eeff</code>
; fontcolor 或 font : 文字本身颜色，默认 <code>#fff</code>
; stroke : 文字描边颜色，默认 <code>#fff</code>
; mode : 呼吸模式 — <code>hover</code>（鼠标悬停呼吸）或 <code>auto</code>（自动呼吸），默认 <code>hover</code>
; delay : 动画延迟时间（仅 auto 模式），如 <code>0.5s</code>、<code>1s</code>
; size : 文字字号，如 <code>24px</code>、<code>2em</code>
; css : 额外 CSS 行内样式
 
== 范例 ==
{| class="wikitable" width="100%"
! 输入 !! 结果
|-
|<code><nowiki>{{Neon|Hello World}}</nowiki></code>
|{{Neon|Hello World}}
|-
|<code><nowiki>{{Neon|霓虹文字|color=#ff3377}}</nowiki></code>
|{{Neon|霓虹文字|color=#ff3377}}
|-
|<code><nowiki>{{Neon|青色霓虹|color=#00eeff}}</nowiki></code>
|{{Neon|青色霓虹|color=#00eeff}}
|-
|<code><nowiki>{{Neon|金色文字|color=#ffd700|stroke=#00eeff}}</nowiki></code>
|{{Neon|金色文字|color=#ffd700|stroke=#00eeff}}
|-
|<code><nowiki>{{Neon|自动呼吸|color=#00eeff|mode=auto}}</nowiki></code>
|{{Neon|自动呼吸|color=#00eeff|mode=auto}}
|-
|<code><nowiki>{{Neon|粉字蓝光|color=#00eeff|fontcolor=#ff3377}}</nowiki></code>
|{{Neon|粉字蓝光|color=#00eeff|fontcolor=#ff3377}}
|-
|<code><nowiki>{{Neon|大号标题|color=#ffd700|size=36px}}</nowiki></code>
|{{Neon|大号标题|color=#ffd700|size=36px}}
|}
 
== 波浪效果 ==
多个自动呼吸文字用 <code>delay</code> 错开节奏，形成此起彼伏的波浪感：
{| class="wikitable" width="100%"
! 输入 !! 结果
|-
|<code><nowiki>{{Neon|●|color=#ff3377|mode=auto|delay=0s}}</nowiki></code>
|{{Neon|●|color=#ff3377|mode=auto|delay=0s}}
|-
|<code><nowiki>{{Neon|●|color=#00eeff|mode=auto|delay=0.5s}}</nowiki></code>
|{{Neon|●|color=#00eeff|mode=auto|delay=0.5s}}
|-
|<code><nowiki>{{Neon|●|color=#ffd700|mode=auto|delay=1s}}</nowiki></code>
|{{Neon|●|color=#ffd700|mode=auto|delay=1s}}
|-
|<code><nowiki>{{Neon|●|color=#7fff00|mode=auto|delay=1.5s}}</nowiki></code>
|{{Neon|●|color=#7fff00|mode=auto|delay=1.5s}}
|}
 
== 与 Font 模板对比 ==
<nowiki>{{Font}}</nowiki> 设置静态颜色，<nowiki>{{Neon}}</nowiki> 增加动态呼吸光效：
{| class="wikitable" width="100%"
! 模板 !! 输入 !! 结果
|-
! Font
| <code><nowiki>{{Font|color=#ff3377|静态粉色}}</nowiki></code>
| {{Font|color=#ff3377|静态粉色}}
|-
! Neon
| <code><nowiki>{{Neon|动态粉色|color=#ff3377}}</nowiki></code>
| {{Neon|动态粉色|color=#ff3377}}
|-
! Font
| <code><nowiki>{{Font|color=#00eeff|静态青色}}</nowiki></code>
| {{Font|color=#00eeff|静态青色}}
|-
! Neon
| <code><nowiki>{{Neon|动态青色|color=#00eeff|mode=auto}}</nowiki></code>
| {{Neon|动态青色|color=#00eeff|mode=auto}}
|}
 
== 与 Font 模板套用 ==
两个模板可以互相嵌套，各司其职：
 
=== 方式一：Font 包 Neon（推荐） ===
Font 负责字体、背景等样式，Neon 负责发光效果：
 
{| class="wikitable" width="100%"
! 输入 !! 结果
|-
|<code><nowiki>{{Font|font=黑体|size=24px|{{Neon|黑体霓虹|color=#ff3377}}}}</nowiki></code>
|{{Font|font=黑体|size=24px|{{Neon|黑体霓虹|color=#ff3377}}}}
|-
|<code><nowiki>{{Font|font=SimSun|size=28px|color=#ffd700|bgcolor=#1a1a1a|{{Neon|金色宋体|color=#ffd700|mode=auto}}}}</nowiki></code>
|{{Font|font=SimSun|size=28px|color=#ffd700|bgcolor=#1a1a1a|{{Neon|金色宋体|color=#ffd700|mode=auto}}}}
|-
|<code><nowiki>{{Font|font=Consolas|size=22px|{{Neon|Code Glow|color=#00eeff|mode=auto|delay=0.5s}}}}</nowiki></code>
|{{Font|font=Consolas|size=22px|{{Neon|Code Glow|color=#00eeff|mode=auto|delay=0.5s}}}}
|}
 
=== 方式二：Neon 包 Font ===
Neon 提供发光背景，Font 控制内部文字细节。注意此时 Font 的 <code>color</code> 会覆盖外层：
{| class="wikitable" width="100%"
! 输入 !! 结果
|-
|<code><nowiki>{{Neon|{{Font|color=#ffff00|size=20px|内部黄色字}}|color=#ff3377|mode=hover}}</nowiki></code>
|{{Neon|{{Font|color=#ffff00|size=20px|内部黄色字}}|color=#ff3377|mode=hover}}
|}
 
=== 方式三：css 参数传入字体 ===
无需嵌套，直接用 Neon 的 <code>css</code> 参数指定字体：
{| class="wikitable" width="100%"
! 输入 !! 结果
|-
|<code><nowiki>{{Neon|一行搞定|color=#ff3377|size=26px|css=font-family:黑体;}}</nowiki></code>
|{{Neon|一行搞定|color=#ff3377|size=26px|css=font-family:黑体;}}
|}
 
=== 实用技巧 ===
* Font 的 <code>color</code> 会改变文字颜色，Neon 的 <code>color</code> 是发光颜色 — 两者含义不同，嵌套时注意区分
* 建议用 Font 在外层统一控制字体和背景，Neon 在内层只负责发光
* 如果只需要改字体，直接用 Neon 的 <code>css=font-family:...</code> 更简洁
 
== 高级用法 ==
逐字呼吸效果：
<pre>{{Neon|霓|color=#ff3377|mode=auto|delay=0s}}{{Neon|虹|color=#ff3377|mode=auto|delay=0.15s}}{{Neon|呼|color=#ff3377|mode=auto|delay=0.3s}}{{Neon|吸|color=#ff3377|mode=auto|delay=0.45s}}{{Neon|灯|color=#ff3377|mode=auto|delay=0.6s}}</pre>
<div style="background:#000;border:1px solid #333;border-radius:6px;padding:10px 14px;">
{{Neon|霓|color=#ff3377|mode=auto|delay=0s}}{{Neon|虹|color=#ff3377|mode=auto|delay=0.15s}}{{Neon|呼|color=#ff3377|mode=auto|delay=0.3s}}{{Neon|吸|color=#ff3377|mode=auto|delay=0.45s}}{{Neon|灯|color=#ff3377|mode=auto|delay=0.6s}}
</div>
 
</noinclude>

2026年7月17日 (五) 00:30的最新版本


本模板之全部来自用户自定义，依 CC BY-SA 3.0 授权。 {{Neon}} 模板用来生成带霓虹呼吸灯效果的文字，像呼吸一样缓缓明暗变化，支持悬停呼吸和自动呼吸两种模式。

语法

{{Neon|文字|color=颜色|fontcolor=颜色|stroke=颜色|mode=模式|delay=时间|size=字号|css=样式}}

参数

1 或 text
文字内容（必填）
color 或 glow
霓虹发光颜色，如 #ff3377、#00eeff
fontcolor 或 font
文字本身颜色，默认 #fff
stroke
文字描边颜色，默认 #fff
mode
呼吸模式 — hover（鼠标悬停呼吸）或 auto（自动呼吸），默认 hover
delay
动画延迟时间（仅 auto 模式），如 0.5s、1s
size
文字字号，如 24px、2em
css
额外 CSS 行内样式

范例

输入 结果
{{Neon|Hello World}} Hello World
{{Neon|霓虹文字|color=#ff3377}} 霓虹文字
{{Neon|青色霓虹|color=#00eeff}} 青色霓虹
{{Neon|金色文字|color=#ffd700|stroke=#00eeff}} 金色文字
{{Neon|自动呼吸|color=#00eeff|mode=auto}} 自动呼吸
{{Neon|粉字蓝光|color=#00eeff|fontcolor=#ff3377}} 粉字蓝光
{{Neon|大号标题|color=#ffd700|size=36px}} 大号标题

波浪效果

多个自动呼吸文字用 delay 错开节奏，形成此起彼伏的波浪感：

输入 结果
{{Neon|●|color=#ff3377|mode=auto|delay=0s}} ●
{{Neon|●|color=#00eeff|mode=auto|delay=0.5s}} ●
{{Neon|●|color=#ffd700|mode=auto|delay=1s}} ●
{{Neon|●|color=#7fff00|mode=auto|delay=1.5s}} ●

与 Font 模板对比

{{Font}} 设置静态颜色，{{Neon}} 增加动态呼吸光效：

模板 输入 结果
Font {{Font|color=#ff3377|静态粉色}} 静态粉色
Neon {{Neon|动态粉色|color=#ff3377}} 动态粉色
Font {{Font|color=#00eeff|静态青色}} 静态青色
Neon {{Neon|动态青色|color=#00eeff|mode=auto}} 动态青色

与 Font 模板套用

两个模板可以互相嵌套，各司其职：

方式一：Font 包 Neon（推荐）

Font 负责字体、背景等样式，Neon 负责发光效果：

输入 结果
{{Font|font=黑体|size=24px|{{Neon|黑体霓虹|color=#ff3377}}}} 黑体霓虹
{{Font|font=SimSun|size=28px|color=#ffd700|bgcolor=#1a1a1a|{{Neon|金色宋体|color=#ffd700|mode=auto}}}} 金色宋体
{{Font|font=Consolas|size=22px|{{Neon|Code Glow|color=#00eeff|mode=auto|delay=0.5s}}}} Code Glow

方式二：Neon 包 Font

Neon 提供发光背景，Font 控制内部文字细节。注意此时 Font 的 color 会覆盖外层：

输入 结果
{{Neon|{{Font|color=#ffff00|size=20px|内部黄色字}}|color=#ff3377|mode=hover}} 内部黄色字

方式三：css 参数传入字体

无需嵌套，直接用 Neon 的 css 参数指定字体：

输入 结果
{{Neon|一行搞定|color=#ff3377|size=26px|css=font-family:黑体;}} 一行搞定

实用技巧

  • Font 的 color 会改变文字颜色，Neon 的 color 是发光颜色 — 两者含义不同，嵌套时注意区分
  • 建议用 Font 在外层统一控制字体和背景，Neon 在内层只负责发光
  • 如果只需要改字体，直接用 Neon 的 css=font-family:... 更简洁

高级用法

逐字呼吸效果： 

{{Neon|霓|color=#ff3377|mode=auto|delay=0s}}{{Neon|虹|color=#ff3377|mode=auto|delay=0.15s}}{{Neon|呼|color=#ff3377|mode=auto|delay=0.3s}}{{Neon|吸|color=#ff3377|mode=auto|delay=0.45s}}{{Neon|灯|color=#ff3377|mode=auto|delay=0.6s}}

霓 虹 呼 吸 灯


检索自“https://pigeongames.gaoice.run/index.php?title=模板:Neon&oldid=55642”