如何使用模板仅对自己的评论应用样式

用于仅对自己的评论应用不同样式的 CSS 示例

※请务必先复制模板并新建一个另取名称的文件夹后再进行自定义

在 OBS 中显示模板,并在自定义 CSS 中添加如下应用的 CSS

[data-user='你的名字'] {  
  background: #000;  
}

示例 在 Line 模板中让特定用户名的对话气泡显示在相反一侧

在 OBS 的自定义 CSS 中添加以下 CSS

※ 请将"测试用户名"部分替换为对应的用户名

[data-user="测试用户名"] {  
  --lcv-side-left-visible: none;  
  --lcv-side-right-visible: block;  
  --lcv-side: var(--lcv-side-right);  
  --lcv-icon-side: var(--lcv-icon-side-right);  
  align-self: flex-end;  
}  
[data-user="测试用户名"] .comment-block {  
  text-align: right;  
}  
[data-user="测试用户名"] .comment-text {  
  text-align: left;  
}

※ line-right 的情况

[data-user="测试用户名"] {  
  --lcv-side-left-visible: block;  
  --lcv-side-right-visible: none;  
  --lcv-side: var(--lcv-side-left);  
  --lcv-icon-side: var(--lcv-icon-side-left);  
  align-self: flex-start;  
}  
[data-user="测试用户名"] .comment-block {  
  text-align: left;  
}  
[data-user="测试用户名"] .comment-text {  
  text-align: right;  
}