跳到主要内容

颜色简介

颜色可以使用预定义的颜色名称，或使用 RGB、HEX、HSL、RGBA 或 HSLA 值。

颜色名称​

在 HTML 中，可以使用颜色名称指定颜色

<div style="background-color: red; padding: 3px 5px">red</div>
<div style="background-color: blue; padding: 3px 5px">blue</div>
<div style="background-color: yellow; padding: 3px 5px">yellow</div>
<div style="background-color: green; padding: 3px 5px">green</div>
<div style="background-color: mediumseagreen; padding: 3px 5px">mediumseagreen</div>
<div style="background-color: dodgerblue; padding: 3px 5px">dodgerblue</div>
about:blank

背景颜色​

设置背景颜色
<h1 style="background-color: dodgerblue;text-align: center"></h1>
about:blank

文本颜色​

设置文本的颜色

<h1 style="background-color: dodgerblue;color: white;text-align: center;"></h1>
about:blank

边框颜色​

设置边框的颜色

<h1 style="background-color: dodgerblue;color: white;text-align: center;border:5px solid black;"></h1>
about:blank

颜色值​

在HTML中，颜色也可以使用RGB值，十六进制值，HSL值、RGBA值和HSLA值来指定。

以下三个 p 元素的背景颜色设置为 RGB， 十六进制和 HSL 值：

<p style="background-color:rgb(198, 230, 71)">rgb(198, 230, 71)</p>
<p style="background-color:#c6e647">#c6e647</p>
<p style="background-color:hsl(72.08deg, 76.08%, 59.02%)">hsl(72.08deg, 76.08%, 59.02%)</p>

<p style="background-color:rgba(198, 230, 71, 0.5)">rgba(198, 230, 71, 0.5)</p>
<p style="background-color:hsla(72.08deg, 76.08%, 59.02%, 0.5)">hsla(72.08deg, 76.08%, 59.02%, 0.5)</p>
about:blank

HTML 参考​

名称描述

CSS 参考​

名称描述