background-color是设置纯色背景的唯一推荐方式，bgcolor已废弃；它语义清晰、不干扰其他背景样式，支持关键字、十六进制、rgb/rgba等写法，但需注意元素尺寸、覆盖规则及透明度控制。
background-color 是唯一推荐的设置方式，bgcolor 属性已废弃，不该用。
直接写 style="background-color: ..." 最快但有风险
适合调试、服务端动态拼接或框架里绑定样式（比如 React 的 style={{ backgroundColor: color }}），但别在多个元素上重复写。
- 写错格式会失效：必须是
background-color，不是background—— 后者会清掉已有背景图、重复等设置 - 颜色值支持
#f00、rgb(255, 0, 0)、rgba(0, 0, 0, 0.2)、tomato等，但避免用太生僻的颜色名（如darkslategray容易拼错） - 如果
div没内容、没高度、没min-height，背景色就“看不见”——它真设置了，只是容器塌陷了
background 简写会悄悄抹掉 background-color
这是最常被忽略的坑：只要用了 background，哪怕只写 background: #fff;，也会把 background-image、background-repeat 等全重置为默认值。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 想同时设颜色和图片？必须显式写出全部：
background: #eee url("bg.png") no-repeat center / cover; - 如果之前用
background-color: #333;，后来加了background: url(...);，颜色就没了 - 查不到背景色？先打开浏览器开发者工具，看 computed 样式里
background-color是不是transparent
用类名（class）比选标签更安全
在 <style></style> 或外部 CSS 里定义类，而不是直接写 div { background-color: #f9f9f9; }。
- 避免污染全局：一个
div设了背景，不该让所有div都变色 - 语义清晰：
<div class="card"> + <code>.card { background-color: white; }比div { background-color: white; }更易维护 - 响应式或主题切换时，改一个类名就能批量控制，不用遍历所有
style属性 - 错误写法：
style="opacity: 0.8;"→ 文字也模糊了 - 正确写法：
style="background-color: rgba(0, 0, 0, 0.1);"→ 背景微透，文字清晰 - 注意嵌套：父层
rgba(0,0,0,0.1)+ 子层rgba(0,0,0,0.1)≠ 视觉上 0.2 透明度，实际叠加后更暗
透明背景别用 opacity，用 rgba()
opacity 会让整个元素（包括文字、子元素）一起变透明；rgba() 只影响背景本身。
overflow: hidden 剪掉了边缘，都会让你以为“没生效”。
