html5 中 body 的 text 属性已废弃，必须用 css 的 color 属性配合继承实现全局文本颜色；需注意表单控件不继承、框架重置覆盖、shadow dom 不穿透等问题。
body 标签的 text 属性在 HTML5 中已完全废弃，不能用于全局设文本颜色——它既不校验通过，也不能被 JS 读写，更不支持现代颜色语法。唯一可靠路径是用 CSS 的 color 属性配合继承机制。
直接用 body { color: ... } 是最简方案
把颜色声明写在 <style></style> 块或外链 CSS 文件里即可生效，子元素默认继承：
-
body { color: #2c3e50; }足以覆盖绝大多数段落、标题、列表文字 - 别写成
—— 浏览器可能渲染，但document.body.text返回undefined，且 Lighthouse 会报“使用了过时属性” - 颜色值推荐用十六进制（
#2c3e50）或 HSL（hsl(210, 15%, 25%)），避免命名色（如darkgray）因 UA 解析差异导致不一致
表单控件不继承 color，必须单独处理
<input>、<textarea></textarea>、<select></select> 和 <button></button> 默认无视 body 的 color，因为浏览器 UA 样式强制设了独立值：
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 显式重置：添加
input, textarea, select, button { color: inherit; } - 注意 Firefox 对
<button></button>的 UA 样式更激进，有时需加!important（仅限此处，非全局滥用） - 若用了
appearance: none，务必同步补color，否则可能回退到系统默认色
框架重置样式会覆盖你的 body { color }
Bootstrap、Tailwind 等默认带全局重置规则，比如 * { color: inherit; } 或 p { color: #212529; }，会导致你写的 body { color: ... } 失效：
- 检查开发者工具的 Computed 面板，看最终
color值来源是哪条规则 - 提高选择器 specificity：改用
html body { color: #2c3e50; }或加类名后写.theme-light { color: ...; } - 若用 CSS 自定义属性，必须定义在
:root，而非body：否则color: var(--text-color)在子元素中 fallback 到初始值
Shadow DOM 内部不继承 body 的 color
自定义元素或 Web Component 使用 Shadow DOM 时，body { color } 完全不会穿透进去：
- 必须在 shadow root 内部单独声明，例如在组件
<template></template>中嵌入<style>:host { color: var(--text-color, #2c3e50); }</style> - 无法靠外部样式“一劳永逸”，这是 Shadow DOM 的封装特性，不是 bug
- 如果组件需响应全局主题，得通过
part或 CSS 自定义属性 +:host显式桥接
真正麻烦的不是写那行 body { color: ... }，而是确认它到底有没有生效——得查继承链、UA 样式、框架重置、Shadow DOM 边界，以及是否被内联 style 或 JS 动态覆盖。绕不开这些，就别指望一个属性搞定全局字色。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
