HTML 颜色
颜色名、RGB/RGBA、HEX 十六进制、HSL/HSLA 四种表示法
HTML 颜色
HTML 中颜色可以用颜色名、RGB/RGBA、HEX、HSL/HSLA 四种方式表示。
学完本章你将: 掌握四种颜色表示法、不透明度。
四种表示法
html
<!-- 1. 颜色名(140 种预定义) -->
<p style="color: tomato;">番茄色</p>
<p style="color: dodgerblue;">道奇蓝</p>
<!-- 2. RGB / RGBA(0-255) -->
<p style="color: rgb(255, 99, 71);">RGB 番茄色</p>
<p style="color: rgba(255, 99, 71, 0.5);">半透明番茄色</p>
<!-- 3. HEX 十六进制(#RRGGBB) -->
<p style="color: #FF6347;">HEX 番茄色</p>
<p style="color: #FF634780;">带透明度 HEX</p>
<!-- 4. HSL / HSLA(色相/饱和度/亮度) -->
<p style="color: hsl(9, 100%, 64%);">HSL 番茄色</p>
常用颜色速查
| 颜色 | 名称 | HEX |
|---|---|---|
| 黑 | black | #000000 |
| 白 | white | #FFFFFF |
| 红 | red | #FF0000 |
| 绿 | green | #008000 |
| 蓝 | blue | #0000FF |
| 灰 | gray | #808080 |
背景与边框颜色
html
<p style="background-color: #f0f0f0; color: #333; border: 2px solid #999;">
灰背景 + 深灰文字 + 灰色边框
</p>