弹幕颜色和字号需在每条数据中单独设置，canvas中color控制描边色、fontsize单位px且需手动缩放，dom中应直接内联style而非class或css变量。
弹幕颜色和字号不能靠 CSS 全局控制，必须在每条弹幕数据里单独设，或在 canvas 绘制时动态传入。
canvas 弹幕中 color 和 fontSize 必须写在数据对象里
用 canvasBarrage() 或自研 Barrages 类时，颜色和字号不是配置项，而是每条弹幕的属性。Canvas 不吃 CSS 样式，color 字段控制描边（文字默认白色），fontSize 控制大小。
-
color值是描边色，不是填充色；文字本体仍是白色，靠描边显色 - 如果想改文字填充色，得进
canvasBarrage()源码，把ctx.fillStyle = '#fff'改成变量 -
fontSize单位是 px，但 canvas 渲染不自动缩放，需配合ctx.scale()或监听resize手动重设 - 错误写法：
{ value: 'hello', style: { color: 'red', fontSize: 24 } }—— 多数 canvas 弹幕库不识别嵌套style
DOM 弹幕用 class + JS 动态加内联样式最稳
基于 span 的全屏/盒子弹幕，颜色字号走内联样式比 class 更可靠，避免 CSS 优先级冲突或继承污染。
- 创建弹幕元素后立即设：
span.style.color = data[i].color || '#fff' - 字号别用
em或rem，固定px值，比如span.style.fontSize = (data[i].fontSize || 20) + 'px' - 注意：IE 下
innerText不兼容，统一用textContent - 若用 CSS 变量控制，得提前在
:root定义，并用getComputedStyle读取，不如直接内联快
range 区间影响颜色显示区域，别忽略
部分 canvas 弹幕库（如 canvasBarrage）支持 range: [0, 0.5] 控制弹幕只在画布上半区出现——这会间接影响颜色辨识度：上半区可能有字幕遮挡、亮度高，下半区常偏暗。同一 color 在不同 range 下视觉效果可能差很多。
- 深色背景配浅色弹幕时，
range靠上的弹幕建议加描边（即用strokeStyle），靠下的可减描边保清晰度 - 测试时别只看默认
[0, 1]，要分别跑[0, 0.3]、[0.7, 1]看颜色是否被压暗或发灰 - 没有
range支持的库，就只能靠y坐标手动分区，再按区域分组设color
真正麻烦的不是设颜色字号，而是 canvas 弹幕里文字描边与填充分离、DOM 弹幕里动态插入后样式未生效却查不到原因——这两处卡住的人最多。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
