CSS color属性-之路教程

CSS color 属性值说明

值	说明
color	描述文字的颜色和文字装饰。可以使用颜色名称、十六进制颜色代码、rgb（）、rgba（）、hsl（）、hsla（）。
initial	它使属性使用其默认值。
inherit	它从其父元素继承属性。

语法

color: color | initial | inherit;

颜色属性示例：

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .blue {
        color: #1c87c9;
      }
    </style>
  </head>
  <body>
    <h2>Color 属性示例</h2>
    <p>默认颜色段落</p>
    <p class="blue">蓝色段落</p>
    <p>默认颜色段落</p>
  </body>
</html>

我们可以将十六进制、RGB、RGBA、HSL、HSLA 或者颜色名称设置为颜色属性的值。

具有命名颜色值的颜色属性示例：

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .blue {
        color: blue;
      }
    </style>
  </head>
  <body>
    <h2>Color 属性示例</h2>
    <p>默认颜色段落</p>
    <p class="blue">使用颜色名称设置段落文本颜色</p>
    <p>默认颜色段落</p>
  </body>
</html>

具有十六进制值的颜色属性示例：

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .color {
        color: #8ebf42;
      }
    </style>
  </head>
  <body>
    <h2>Color 属性示例.</h2>
    <p>默认颜色段落</p>
    <p class="color">使用16进制颜色值设置文本颜色</p>
    <p>默认颜色段落</p>
  </body>
</html>

具有 RGB 值的颜色属性示例：

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .color {
        color: rgb(142, 191, 66);
      }
    </style>
  </head>
  <body>
    <h2>Color 属性示例.</h2>
    <p>默认颜色段落</p>
    <p class="color">使用RGB颜色值设置文本颜色</p>
    <p>默认颜色段落</p>
  </body>
</html>

具有 HSL 值的颜色属性示例：

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .color {
        color: hsl(89, 43%, 51%);
      }
    </style>
  </head>
  <body>
    <h2>Color 属性示例.</h2>
    <p>默认颜色段落</p>
    <p class="color">使用HSL颜色值设置文本颜色</p>
    <p>默认颜色段落</p>
  </body>
</html>

CSS color属性

color 颜色属性描述了文本内容和文本装饰的颜色。
背景颜色可以与文本颜色结合，使文本易于阅读。
我们可以在我们的 HTML 颜色部分找到网络颜色，并尝试使用我们的颜色选择器工具选择我们喜欢的颜色。

此属性的默认值因浏览器而异。

初始值	不同的浏览器不同。
应用于	所有元素。它也适用于：::first-letter 和 ::first-line。
继承	可继承
可动画的	颜色是可设置动画的。
版本	CSS1
DOM 语法	object.style.color=“#1c87c9”；

日期：2020-06-02 22:14:22 来源：oir作者：oir

←CSS clip属性

CSS column-count 属性→