HTML5中可通过color和background-color属性设置文字与背景颜色，支持内联样式、内部样式表、外部CSS文件、CSS变量及渐变色五种方法。
如果您希望在HTML5中为网页元素添加颜色，可以通过CSS的color属性设置文字颜色，或通过background-color属性设置背景颜色。以下是具体的操作方法：
一、使用内联样式设置颜色
内联样式直接在HTML元素的style属性中定义CSS规则，适用于单个元素的快速着色。
1、在HTML5标签中添加style属性，例如： 这是一段文字
2、将color值替换为颜色名称（如blue、green）、十六进制值（如#FF5733）、RGB值（如rgb(255, 87, 51)）或RGBA值（如rgba(255, 87, 51, 0.8)）。
立即学习“前端免费学习笔记（深入）”；
3、background-color可同时设置，支持与color相同的颜色格式，且可设为transparent实现透明背景。
二、使用内部样式表设置颜色
内部样式表通过
1、在HTML5文档的
部分插入。2、为需要着色的元素添加对应的选择器，例如：标题文字
或
3、确保class名或标签名与
三、使用外部CSS文件设置颜色
外部样式表将CSS代码保存为独立的.css文件，通过引入，适合多页面共享统一配色方案。
1、新建一个文本文件，保存为style.css，内容示例：p.text-green { color: #27ae60; } div.highlight { background-color: #f1c40f; }。
2、在HTML5文档的
中添加链接：，确保href路径正确指向该CSS文件。3、在HTML中应用对应类名，例如： 绿色文字
四、使用CSS变量统一管理颜色
CSS变量（自定义属性）允许在根元素中定义颜色值，后续通过var()函数复用，便于全局颜色调整。
1、在
2、在其他CSS规则中调用变量：h2 { color: var(--primary-color); } body { background-color: var(--bg-light); }。
3、修改:root中的变量值即可一次性更新所有引用该变量的样式，无需逐个查找替换。
五、使用渐变色作为背景
background-color支持线性渐变（linear-gradient）和径向渐变（radial-gradient），可创建丰富的色彩过渡效果。
1、在style属性或CSS规则中使用渐变语法：background: linear-gradient(to right, #ff6b6b, #4ecdc4);。
2、to right表示从左到右渐变，也可写为90deg；颜色可指定两个或多个，用逗号分隔。
3、若需兼容旧版浏览器，可在渐变前添加-moz-、-webkit-等前缀，但现代HTML5环境通常无需前缀。
