body 的 text 属性不应使用，因html5已移除支持，导致校验失败、浏览器兼容性差、无法js读写、不支持现代颜色语法；应改用css的color属性配合继承规则与框架重置逻辑。

body 的 text 属性确实能设置网页默认文本颜色，但它在现代开发中不该用——不是不能跑，而是用了就埋下兼容性、可维护性和样式失控的坑。

---

为什么不能直接用 text 属性

• HTML5 已完全移除 text 属性支持，任何新项目用它都会导致文档类型校验失败（比如 !DOCTYPE html 下无效）
• 浏览器虽仍“容忍”该属性（出于向后兼容），但行为不保证：比如某些移动端 WebView 可能忽略、或与 CSS 冲突时优先级混乱
• 它无法被 JavaScript 动态读写为标准 DOM 属性（document.body.text 在多数浏览器返回 undefined 或空字符串，而非实际值）
• 不支持渐变、HSL、RGBA、CSS 变量等现代颜色语法，只能写 "red"、"#000"、"rgb(0,0,0)" 这类基础值

---

正确做法：用 CSS 的 color 设置 body

这才是当前唯一可靠、可扩展、可调试的方式：

• 直接在 中写：

  

  Wechat HTML Publisher

  直接上传HTML富文本到微信公众号草稿箱。支持完整的HTML格式,无需Markdown转换。

  下载

  <style>
  body { color: #2c3e50; }
  </style>

• 或外链样式表中定义：

  body {
  color: hsl(210, 15%, 25%);
  }

• 注意继承边界：
  color 是可继承属性，但以下元素默认不继承，必须显式重设：

  • <input>、<textarea></textarea>、<select></select>（它们有 UA 样式强制设了独立 color）
  • <button></button>（尤其在 Firefox 中表现不一致）
  • 某些内联 SVG 文本节点

---

容易被忽略的覆盖场景

• Bootstrap、Tailwind 等框架通常带全局重置（如 <em>, </em>::before, *::after { color: inherit; }），可能让你的 body { color: ... } 失效
• 如果用了 CSS 自定义属性（var(--text-color)），确保它定义在 :root，而不是只在 body 上——否则子元素里用 color: var(--text-color) 会 fallback 到初始值
• 使用 Shadow DOM 时，body 的 color 不会穿透到 shadow root 内部，需在内部单独声明

---

text 属性只存在于老项目迁移或极简静态页的权宜之计。真正要控制字色，就得直面 CSS 继承规则、表单控件的 UA 样式、以及框架重置逻辑——绕不开，也别想靠一个过时属性偷懒。