27、网页颜色的运用与指定方法详解

网页颜色的运用与指定方法详解

1. 网页颜色概述

在网页设计中，我们可以为页面的多个元素添加颜色，如背景色、边框色，还有字体颜色。那么计算机上的颜色究竟是如何工作的呢？

网页颜色是通过红（Red）、绿（Green）、蓝（Blue）三种颜色的比例来确定的，我们可以将每种颜色的比例从 0 到 100% 进行指定，然后将它们组合起来得到最终的颜色。例如：
- 当红色、绿色和蓝色都为 100% 时，得到的是白色。因为在计算机屏幕上，颜色混合是光的混合，混合后的颜色会更亮。
- 若每种颜色（红、绿、蓝）都只占 60%，则会得到灰色。这是因为三种颜色的比例相等，但屏幕接收到的光量相对较少。
- 当红色为 80%、绿色为 40%、蓝色为 0% 时，会得到橙色。如果某一种颜色的比例为 0%，则它对最终颜色没有影响。
- 当红色、绿色和蓝色都为 0% 时，屏幕没有接收到任何光，得到的就是黑色。

2. 颜色名称指定法

有人可能会问，为什么要了解这些“颜色理论”，能不能直接通过颜色名称来指定颜色呢？实际上，虽然可以使用颜色名称，但 CSS 仅定义了约 150 种颜色名称，这会限制页面的表现力。不过，使用颜色名称仍然是一种简单直接的指定颜色的方法。

2.1 指定颜色的方法

在 CSS 中，通过颜色名称指定颜色非常简单，只需将颜色名称作为属性的值即可。CSS 颜色名称不区分大小写。例如，要将 body 元素的背景颜色指定为“silver”，可以这样写：

body {
    background-color: silver;