color属性是唯一可靠、现代且被所有浏览器支持的标签颜色控制方式，应避免使用已废弃的等属性；推荐用内联style或class选择器设置颜色，优先采用十六进制值，并注重语义化命名与可访问性对比度要求。
color 属性是唯一可靠、现代且被所有浏览器支持的标签颜色控制方式。用 <font color></font> 或其他废弃属性不仅无效，还会在严格模式下被忽略。
怎么给单个 HTML 标签加颜色（内联 style 最快）
直接在标签里写 style="color: ..."，适合临时调试或个别元素高亮：
-
color值支持名称（red、darkblue）、十六进制（#336699）、rgb(51, 102, 153)、hsl(210, 33%, 40%)，推荐优先用十六进制——兼容性好、可读性强、设计师也常用 - 别写
<font color="red">文本</font>：HTML5 已废弃<font></font>标签，Chrome/Firefox 等现代浏览器虽会渲染，但 W3C 验证失败，且无法继承、无法用 CSS 选择器控制 - 注意引号闭合：
style="color:red;"和style='color:red;'都行，但别混用或漏掉引号，否则整个属性失效
怎么让一类标签统一变色（class 选择器最实用）
用 class 配合内部或外部 CSS，避免重复写 style，也方便后期批量改色：
- 给多个标签加相同 class，比如
<p class="warning">警告信息</p>和<span class="warning">请确认</span> - 在
里加<style>.warning { color: #d32f2f; }</style>，或写进外部styles.css文件再用<link rel="stylesheet" href="styles.css">引入 - 不要用
id控制颜色：一个id在页面中只能出现一次，无法复用；而class天然支持多实例
怎么按语义区分不同标签的颜色（语义 class + CSS 组合）
颜色不该只看“好不好看”，更要传递含义。比如错误提示用红色、成功用绿色、待处理用橙色——靠 class 名体现意图，而不是靠颜色值硬编码：
- 写成
<div class="status-error">提交失败</div>，而不是<div style="color:#f44336;">提交失败</div> - CSS 里定义
.status-error { color: #f44336; }、.status-success { color: #4caf50; }，这样改主题时只需换一组颜色变量，不用遍历所有 HTML - 避免用纯描述性 class 如
red-text：一旦设计规范改成深红+阴影，这个 class 就名不副实，维护成本陡增
真正容易被忽略的是可访问性：深灰文字（如 #333）在白色背景上对比度不足，屏幕阅读器用户或视力弱者可能根本看不见。WCAG 要求正文至少达到 4.5:1 对比度，用浏览器 DevTools 的颜色拾取器能直接验算。别只盯着“颜色设上了”，得确保“谁都能看清”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
