叠加层自定义

先从模板开始，再仅在需要时使用 URL 选项和 CSS。

最快方式：选择模板

有 StreamElements 或 Streamlabs 聊天皮肤？通过聊天皮肤指南导入自定义组件.

模板是获得精美叠加层的最简单方式，无需从头编写 CSS。

模板库，包含搜索、分类筛选器和模板预览 — 搜索和筛选模板，然后将生成的叠加层 URL 复制到 OBS。

自定义层级

层级	适用用途	位置
模板控件	快速调整外观。	模板库.
URL 参数	行为、标签、筛选器、缩放和限制。	叠加层 URL 查询字符串。
OBS 自定义 CSS	为单个 OBS 来源进行小范围样式覆盖。	OBS 浏览器来源属性。
托管／自行托管 CSS	可在多个叠加层中复用的样式。	`&css=` 或 `&b64css=`.
自定义叠加层	完全自定义行为。	自定义叠加层指南.

常用 URL 选项

featured.html?session=YOUR_SESSION&scale=1.1&limit=10

session 将叠加层连接到正确的聊天室。
scale 无需重写 CSS 即可更改尺寸。
limit 在支持的页面上控制保持可见的消息数量。
hidesource 隐藏停靠面板中的平台来源标签（仅dock.html ）。
css 和 b64css 加载自定义样式。

使用 OBS 前先预览

叠加层示例预览，显示带样式的 Social Stream 聊天消息输出 — 测试 OBS 前，先在普通浏览器中打开最终 URL。

常见解决办法

浏览器中正常，OBS 中不正常： 移除 OBS 自定义 CSS 并刷新浏览器来源。
缺少字体： 使用直接的 HTTPS 字体文件链接，并检查 CORS／防盗链规则。
所有内容都不可见： 检查不透明度、颜色、筛选器，以及页面是否需要精选／事件载荷。
更改 URL 没有效果： 刷新 OBS 来源或替换 URL。