向您的网站添加颜色可以唤起情绪,设置氛围,并使您的整体设计更具凝聚力。

在这篇文章中,我们将介绍关于设计原则所需的一切与HTML颜色代码相关,所以你可以更新和添加到你的网站上的颜色。无论你是重新设计你的网站或者第一次选择调色板,学习这项基本技能可以帮助您创建一个反映您品牌的外观和感受的网站。

立即下载:免费介绍HTML和CSS指南

让我们从定义什么是HTML颜色代码开始。

HTML颜色代码

我们每天都看到颜色,并为他们有名字,如红色和黄色。在这些颜色中,我们还有数百种不同的阴影,我们也有名字。例如,不仅仅是粉红色,而是霓虹粉红色,泡沫粉红色,玫瑰,紫红色,洋红色和无数别人。

问题是,即使我们试图得到更具体的颜色名称,不同的人可能会有不同的解释。一个人的霓虹粉色可能是另一个人的紫红色,而另一个人的紫红色可能是另一个人的品红。

为了避免这种在线不精确,我们使用HTML颜色代码。计算机可以解释HTML颜色代码来显示适当的颜色。这些代码可以有多种格式,包括十六进制颜色代码。下面让我们仔细看看这种格式。

十六进制颜色代码

十六进制彩色代码是网站和其他软件应用程序中最受欢迎的HTML格式。雷竞技苹果下载官方版每个十六进制代码由三个字节十六进制数字组成,前面由HASHTAG之前。

字节是十六进制代码中的一对字符,表示颜色中的三种基色(红、绿、蓝)的强度。取值范围从00(原色的最低强度)到FF(原色的最高强度)

这意味着每个十六进制代码由三对或六个字符组成。这六个字符可以是十个数字(0-9)和六个字母(A-F)的任何组合。这个16符号数字系统被称为十六进制代码。总共有16,777,216个可能的组合。让我们试着弄清楚他们中的一些。

为了计算出白色的十六进制色码,考虑到你必须将三种原色的每一种都充分混合。这意味着白色的十六进制颜色代码是#FFFFFF。因为黑色缺少原色,所以它的十六进制颜色代码是#000000。如果你想要红色,那么你想要最高强度的红色和最低强度的其他两种原色。因此,红色的十六进制代码将是#FF0000。看看下面的图表,看看其他一些组合。

HTML六角形代码的并排比较,次级,二级和三级颜色

更多的例子请看下面的截图。

常用颜色和HTML十六进制颜色代码列表

为了更熟悉十六进制代码,您可以使用像彩色拾取器和轮子等在线工具一起玩。

使用下面所示的彩色拾取器,您可以从黑白到最深的绿色和最亮的蓝调中弄清楚不同颜色的十六进制代码。

彩色选择器显示明亮的蓝色的HTML六角彩色代码

一旦找到您喜欢的颜色,请注意其十六进制代码。这样,您可以在多种设计中和跨通道中重用相同的颜色,这对于一致的品牌来说至关重要。

既然您了解HTML颜色代码和十六进制代码尤其是什么,让我们来看看如何使用HTML颜色代码。

如何使用HTML颜色代码

您可以在网站的HTML中添加十六进制代码以编辑各个元素的颜色。

例如,您想要将一个段落的颜色更改为红色。您只需向要着色的段落元素添加一个样式属性,并使用正确的十六进制代码的颜色属性。代码如下所示:

红色段落文本

使用此代码,我可以转换此博客文章的介绍,使第一段红色。它会在前端看起来像这样:

前端示例使用HTML十六进制代码更改段落为红色

您也可以分开HTML和CSS并实现相同的结果。

以下是您在Doc的头部部分中的CSS:

身体{

颜色:# FF0000;

}

这是您在Doc的身体部分中的HTML:

红色段落文本

使用相同的方法,您可以更改站点的背景、文本和其他元素的颜色。

以颜色构建一个网站

颜色可以帮助在页面上强调一个元素,创建品牌识别,并使您的网站令人难忘。既然您对HTML颜色代码有了基本的理解,您可以在站点上添加或更改颜色以创建凝聚力设计。

既然你有HTML颜色代码,了解其他HTML代码这可以帮助你正确呈现您网站上的信息并进行必要的更新。

新的文字-动作

css的介绍

最初发布于2020年3月1日上午8:00:00,2020年7月27日更新

话题:

设计