Div Background Color

原文：Div Background Color – How to Change Background Color in CSS，作者：Kolade Chris

如果你正在做一个网站开发项目，设置一个漂亮的背景色可以让网站看起来更有吸引力。

要在 CSS 中为一个 div 或相关元素设置背景色，你可以使用 background-color 属性。

在设置背景色时，只要你有创造力，就可以任意发挥。

所以在这篇文章中，我将向你展示如何设置背景色。

使用命名颜色，你可以通过引入 background-color 属性并为其赋值如 red、green、blue等颜色名称来设置背景颜色。

你可以使用以下样式使网页看起来更好。只要给 div 设置一个宽高，背景色就可以生效：

现代浏览器可以识别大约 147 种颜色，因此你仍然受到一些限制。

使用十六进制值，你可以为 div 或任何其他总共 6 个字符的元素设置背景颜色。

十六进制颜色以井号（#）开头，然后是从 0 到 9 的任何数字，最后是从 A 到 F 的任何字母。

前两个值代表红色，接下来的两个代表绿色，最后两个代表蓝色。

使用十六进制值，你可以深入了解色轮，甚至可以使用从未使用过的颜色。

你可以阅读更多关于十六进制颜色的信息。

RGB 是红、绿、蓝的缩写。

要用 RGB 设置背景色，你要用 0 到 255 之间的数字来指定你想要的红色、绿色和蓝色的数量。

RGB 也有一个变体，叫做 RGBA。最后一个 A 表示 alpha，它让你决定你想要的颜色的不透明程度。

alpha 的数值从 0.0 到 1.0。0.0 表示 0% 不透明，0.5 表示 50% 不透明，1.0 表示 100% 不透明。

你可以阅读更多关于 RGB 颜色的信息。

HSL 代表色相（Hue）、饱和度（Saturation）和亮度（lightness）。在你可以为 div 或其他元素指定背景颜色的方式中，它是最动态的。

由于你可以用 4 种不同的方式来应用颜色，你一定想知道你应该使用哪一种。

当你使用命名的颜色时，你在应用不同颜色的深浅方面受到了某种限制。

每种颜色，如红色、绿色、蓝色、黄色或任何其他颜色，都有很多变化，你无法使用命名颜色。

你只能获得浏览器认可的大约 147 种预定义的颜色。另一方面，十六进制的颜色是非常动态的，主要是开发者使用它们，可以随意发挥。这些十六进制颜色允许你使用同一颜色的不同色调。

RGB 颜色和十六进制颜色一样是动态的。你可以指定从 0 到 255 的红、绿、蓝的数量，你还可以使用添加的 alpha 值来指定颜色的透明度。

HSL 是所有这些中最有活力的。你可以准确地指定色轮中从 0 到 360 度的颜色，将饱和度和暗度设置为百分比，并将不透明度设置为 0.0 到 1.0 之间的任何数值。

因此，决定在命名的、十六进制的、RGB 和 HSL 颜色之间使用哪一种，取决于你想有多大的创意，以及你的项目需求是什么。

谢谢你阅读本文。