让代码更简单

当前位置:代码狗 > 开发教程 > WEB开发教程 > 正文

HTML中十六进制颜色代码的构成详解

重要:本文最后更新于2020-11-22 21:18:25,某些文章具有时效性,若有错误或已失效,请在下方留言或联系代码狗

颜色代码在设计开发时用得很多,曾经我专门复制了一篇别人准备的十六进制颜色代码。昨天群里有人发了一个颜色代码页面,我觉得还不错,但是不够全,要知道颜色总共有256X256X25(十六进制FF)=1600万种,要做就要做最全的。所以先了解下颜色的构成,然后用代码自动生成。

颜色的构成

总所周知,颜色是由三原色RGB构成的,在计算机中,一种颜色共有0-255个级别,即对应十六进制00-FF。白色的RGB色彩组合为0,0,0换成十六进制就是FF,FF,FF在使用时写成FFFFFF。有的图像不止三个通道,还有个A通道,表示透明度的。在HTML颜色中一般不使用,我们这里不讨论它。

什么是HTML颜色名

目前所有浏览器都支持以下颜色名;141个颜色名称是在HTML和CSS颜色规范定义的(17标准颜色,再加124);下表列出了所有颜色的值,包括十六进制值。提示: 17标准颜色:黑色,蓝色,水,紫红色,灰色,绿色,石灰,栗色,海军,橄榄,橙,紫,红,白,银,蓝绿色,黄色。

什么是HTML颜色值

颜色由红(R)、绿(G)、蓝(B)组成;颜色值由十六进制来表示红、绿、蓝(RGB);每个颜色的最低值为0(十六进制为00),最高值为255(十六进制为FF);十六进制值的写法为#号后跟三个或六个十六进制字符;三位数表示法为:#RGB,转换为6位数表示为:#RRGGBB。

在CSS中缩写很常用,如果每两位的值相同,可以缩写一半。例如p{color:#000000;}与p{color: #336699;}可写成p{color:#000}与p{color:#369}

CSS中,颜色不仅可以使用数字表示,还能使用百分数、十六进制,如以下颜色代码都是正确的。

p{color:rgb(133,45,200);}
p{color:rgb(20%,33%,25%);}
p{color:#00ffff;}

好了,颜色相关知识就了解到这里,改天搞个页面显示1600万种颜色,不知道会不会卡爆。

感觉很棒!可以赞赏支持我哟~

赞(0) 打赏

评论 1

  1. #1

    不要搞得太复杂了呀!

    万花网2个月前 (11-29)回复
×

请作者吃根烤肠!

支付宝