Fluid-6-导航栏标题添加霓虹灯特效

注意 主题为Fluid!!!!

  1. 修改themes\fluid\source\css\_pages\_base\_widget\header.styl,在里面追加样式(注意缩进):
1
2
3
4
5
6
7
8
9
10
11
.navbar-title
outline none
--c lightseagreen
text-shadow 0 0 10px var(--c),0 0 20px var(--c),0 0 40px var(--c),0 0 80px var(--c),0 0 160px var(--c)
animation animate 5s linear infinite

@keyframes animate{
to{
filter: hue-rotate(360deg)
}
}
  1. 然后修改themes\fluid\layout\_partials\header\navigation.ejs,给其添加上class属性
    找到对应导航栏标题的标签内容:
    <strong><%= theme.navbar.blog_title || config.title %></strong>
    修改为:
    <strong class="navbar-title"><%= theme.navbar.blog_title || config.title %></strong>


觉得不错的话,支持一根棒棒糖吧 ୧(๑•̀⌄•́๑)૭



wechat pay



alipay

Fluid-6-导航栏标题添加霓虹灯特效
http://yuting0907.github.io/posts/e95612a0.html
作者
Echo Yu
发布于
2025年1月15日
许可协议