样式设计

本文由AI生成，可能存在不准确或不完整的内容 未人工校对

在左侧打开“样式设计”，选择编辑对象，再修改字体、字号、颜色、描边和位置。主歌词、翻译、罗马音、双排上行、双排下行和歌曲信息分别保存样式。

• 应用预览：更新当前输出，关闭程序后不保留未保存的修改。
• 保存并应用：更新输出并保存设置，下次启动继续使用。

右侧画布显示浏览器效果。“浏览器打开”可以查看对应页面。调整字号后，检查 OBS 来源宽高，避免文字被裁切。

进度与双排罗马音

“逐字进度”控制有逐字时间数据的填色。“无逐字歌词按时间填色”用于只有句时间的歌词，默认关闭。

选择“双排罗马音”，可以开启上方读音、调整间距，并设置“罗马音跟随歌词填色”。详细说明见日语歌词与罗马音。

当前内容的 CSS 属性

展开“高级 CSS 与动画”。“当前内容的 CSS 属性”跟随上方编辑对象，填写属性即可：

text-shadow: 0 2px 8px #000;
letter-spacing: 2px;

这里不需要选择器。相同属性会覆盖基础控件设置。

完整 CSS

“所有浏览器输出的 CSS 与动画”可以填写选择器、媒体查询和 @keyframes。打开“完整 CSS”开关，点击“应用预览”或“保存并应用”。停用时也需要应用；编辑内容会保留。

“恢复已保存 CSS”恢复上次保存的完整 CSS 和启用状态。原高级 CSS 插件中的设置会自动迁移到这里。

基础设置会写入行内样式。用完整 CSS 覆盖同一属性时，添加 !important，例如：

#main {
    text-shadow: 0 2px 8px #000 !important;
}

换句动画

下面的例子让新句在 350 毫秒内淡入：

.glt-line-enter {
    animation: lyric-fade 350ms ease-out both;
}

@keyframes lyric-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

只应用到主歌词时，将 .glt-line-enter 改为 #main.glt-line-enter。修改 350ms 可以调整动画时长。

动画在文字或歌曲改变时触发，连续播放进度不会重复触发。应用 CSS 预览时会播放一次。当前支持新句进入动画，旧句在换句时直接替换。

完整 CSS 和 CSS 动画用于浏览器源。原生歌词源使用基础样式参数；使用原生源时，请到 OBS 检查效果。

返回首页