CSS中颜色表示方法及颜色表

一：直接用颜色的英文名表示

二：RGB（x,y,z)函数表示,x、y、z、分别是红色、绿色、蓝色的值，x,y,z∈[0,225]，亦可用百分比表示；对比rgba（x,y,z,a）中a是alpha通道设置透明度取值0~1

三：十六进制表示，eg：#ff0000;前两位表示红色，中间两位表示绿色，后两位表示蓝色，范围为00-ff，注意缩写形式

四：hsl（色相，饱和度，亮度）：h：色相，表示范围0~360，如下如色环；s：饱和度，取值范围是0.0%~100%l；亮度：取值范围0.0%~100%；同理hsla

五：直接设置透明度：transparent

颜色表：

颜色 英文代码 形象描述 十六进制 RGB
　 LightPink 浅粉红 #FFB6C1 255,182,193
　 Pink 粉红 #FFC0CB 255,192,203
　 Crimson 猩红 #DC143C 220,20,60
　 LavenderBlush 脸红的淡紫色 #FFF0F5 255,240,245
　 PaleVioletRed 苍白的紫罗兰红色 #DB7093 219,112,147
　 HotPink 热情的粉红 #FF69B4 255,105,180
　 DeepPink 深粉色 #FF1493 255,20,147
　 MediumVioletRed 适中的紫罗兰红色 #C71585 199,21,133
　 Orchid 兰花的紫色 #DA70D6 218,112,214
　 Thistle 蓟 #D8BFD8 216,191,216
　 plum 李子 #DDA0DD 221,160,221
　 Violet 紫罗兰 #EE82EE 238,130,238
　 Magenta 洋红 #FF00FF 255,0,255
　 Fuchsia 灯笼海棠(紫红色) #FF00FF 255,0,255
　 DarkMagenta 深洋红色 #8B008B 139,0,139
　 Purple 紫色 #800080 128,0,128
　 MediumOrchid 适中的兰花紫 #BA55D3 186,85,211
　 DarkVoilet 深紫罗兰色 #9400D3 148,0,211
　 DarkOrchid 深兰花紫 #9932CC 153,50,204
　 Indigo 靛青 #4B0082 75,0,130
　 BlueViolet 深紫罗兰的蓝色 #8A2BE2 138,43,226
　 MediumPurple 适中的紫色 #9370DB 147,112,219
　 MediumSlateBlue 适中的板岩暗蓝灰色 #7B68EE 123,104,238
　 SlateBlue 板岩暗蓝灰色 #6A5ACD 106,90,205
　 DarkSlateBlue 深岩暗蓝灰色 #483D8B 72,61,139
　 Lavender 熏衣草花的淡紫色 #E6E6FA 230,230,250
　 GhostWhite 幽灵的白色 #F8F8FF 248,248,255
　 Blue 纯蓝 #0000FF 0,0,255
　 MediumBlue 适中的蓝色 #0000CD 0,0,205
　 MidnightBlue 午夜的蓝色 #191970 25,25,112
　 DarkBlue 深蓝色 #00008B 0,0,139
　 Navy 海军蓝 #000080 0,0,128
　 RoyalBlue 皇家蓝 #4169E1 65,105,225
　 CornflowerBlue 矢车菊的蓝色 #6495ED 100,149,237
　 LightSteelBlue 淡钢蓝 #B0C4DE 176,196,222
　 LightSlateGray 浅石板灰 #778899 119,136,153
　 SlateGray 石板灰 #708090 112,128,144
　 DoderBlue 道奇蓝 #1E90FF 30,144,255
　 AliceBlue 爱丽丝蓝 #F0F8FF 240,248,255
　 SteelBlue 钢蓝 #4682B4 70,130,180
　 LightSkyBlue 淡蓝色 #87CEFA 135,206,250
　 SkyBlue 天蓝色 #87CEEB 135,206,235
　 DeepSkyBlue 深天蓝 #00BFFF 0,191,255
　 LightBLue 淡蓝 #ADD8E6 173,216,230
　 PowDerBlue 火药蓝 #B0E0E6 176,224,230
　 CadetBlue 军校蓝 #5F9EA0 95,158,160
　 Azure 蔚蓝色 #F0FFFF 240,255,255
　 LightCyan 淡青色 #E1FFFF 225,255,255
　 PaleTurquoise 苍白的绿宝石 #AFEEEE 175,238,238
　 Cyan 青色 #00FFFF 0,255,255
　 Aqua 水绿色 #00FFFF 0,255,255
　 DarkTurquoise 深绿宝石 #00CED1 0,206,209
　 DarkSlateGray 深石板灰 #2F4F4F 47,79,79
　 DarkCyan 深青色 #008B8B 0,139,139
　 Teal 水鸭色 #008080 0,128,128
　 MediumTurquoise 适中的绿宝石 #48D1CC 72,209,204
　 LightSeaGreen 浅海洋绿 #20B2AA 32,178,170
　 Turquoise 绿宝石 #40E0D0 64,224,208
　 Auqamarin 绿玉\碧绿色 #7FFFAA 127,255,170
　 MediumAquamarine 适中的碧绿色 #00FA9A 0,250,154
　 MediumSpringGreen 适中的春天的绿色 #00FF7F 0,255,127
　 MintCream 薄荷奶油 #F5FFFA 245,255,250
　 SpringGreen 春天的绿色 #3CB371 60,179,113
　 SeaGreen 海洋绿 #2E8B57 46,139,87
　 Honeydew 蜂蜜 #F0FFF0 240,255,240
　 LightGreen 淡绿色 #90EE90 144,238,144
　 PaleGreen 苍白的绿色 #98FB98 152,251,152
　 DarkSeaGreen 深海洋绿 #8FBC8F 143,188,143
　 LimeGreen 酸橙绿 #32CD32 50,205,50
　 Lime 酸橙色 #00FF00 0,255,0
　 ForestGreen 森林绿 #228B22 34,139,34
　 Green 纯绿 #008000 0,128,0
　 DarkGreen 深绿色 #006400 0,100,0
　 Chartreuse 查特酒绿 #7FFF00 127,255,0
　 LawnGreen 草坪绿 #7CFC00 124,252,0
　 GreenYellow 绿黄色 #ADFF2F 173,255,47
　 OliveDrab 橄榄土褐色 #556B2F 85,107,47
　 Beige 米色(浅褐色) #F5F5DC 245,245,220
　 LightGoldenrodYellow 浅秋麒麟黄 #FAFAD2 250,250,210
　 Ivory 象牙 #FFFFF0 255,255,240
　 LightYellow 浅黄色 #FFFFE0 255,255,224
　 Yellow 纯黄 #FFFF00 255,255,0
　 Olive 橄榄 #808000 128,128,0
　 DarkKhaki 深卡其布 #BDB76B 189,183,107
　 LemonChiffon 柠檬薄纱 #FFFACD 255,250,205
　 PaleGodenrod 灰秋麒麟 #EEE8AA 238,232,170
　 Khaki 卡其布 #F0E68C 240,230,140
　 Gold 金 #FFD700 255,215,0
　 Cornislk 玉米色 #FFF8DC 255,248,220
　 GoldEnrod 秋麒麟 #DAA520 218,165,32
　 FloralWhite 花的白色 #FFFAF0 255,250,240
　 OldLace 老饰带 #FDF5E6 253,245,230
　 Wheat 小麦色 #F5DEB3 245,222,179
　 Moccasin 鹿皮鞋 #FFE4B5 255,228,181
　 Orange 橙色 #FFA500 255,165,0
　 PapayaWhip 番木瓜 #FFEFD5 255,239,213
　 BlanchedAlmond 漂白的杏仁 #FFEBCD 255,235,205
　 NavajoWhite 纳瓦霍白 #FFDEAD 255,222,173
　 AntiqueWhite 古代的白色 #FAEBD7 250,235,215
　 Tan 晒黑 #D2B48C 210,180,140
　 BrulyWood 结实的树 #DEB887 222,184,135
　 Bisque (浓汤)乳脂,番茄等 #FFE4C4 255,228,196
　 DarkOrange 深橙色 #FF8C00 255,140,0
　 Linen 亚麻布 #FAF0E6 250,240,230
　 Peru 秘鲁 #CD853F 205,133,63
　 PeachPuff 桃色 #FFDAB9 255,218,185
　 SandyBrown 沙棕色 #F4A460 244,164,96
　 Chocolate 巧克力 #D2691E 210,105,30
　 SaddleBrown 马鞍棕色 #8B4513 139,69,19
　 SeaShell 海贝壳 #FFF5EE 255,245,238
　 Sienna 黄土赭色 #A0522D 160,82,45
　 LightSalmon 浅鲜肉(鲑鱼)色 #FFA07A 255,160,122
　 Coral 珊瑚 #FF7F50 255,127,80
　 OrangeRed 橙红色 #FF4500 255,69,0
　 DarkSalmon 深鲜肉(鲑鱼)色 #E9967A 233,150,122
　 Tomato 番茄 #FF6347 255,99,71
　 MistyRose 薄雾玫瑰 #FFE4E1 255,228,225
　 Salmon 鲜肉(鲑鱼)色 #FA8072 250,128,114
　 Snow 雪 #FFFAFA 255,250,250
　 LightCoral 淡珊瑚色 #F08080 240,128,128
　 RosyBrown 玫瑰棕色 #BC8F8F 188,143,143
　 IndianRed 印度红 #CD5C5C 205,92,92
　 Red 纯红 #FF0000 255,0,0
　 Brown 棕色 #A52A2A 165,42,42
　 FireBrick 耐火砖 #B22222 178,34,34
　 DarkRed 深红色 #8B0000 139,0,0
　 Maroon 栗色 #800000 128,0,0
　 White 纯白 #FFFFFF 255,255,255
　 WhiteSmoke 白烟 #F5F5F5 245,245,245
　 Gainsboro 亮灰色 #DCDCDC 220,220,220
　 LightGrey 浅灰色 #D3D3D3 211,211,211
　 Silver 银白色 #C0C0C0 192,192,192
　 DarkGray 深灰色 #A9A9A9 169,169,169
　 Gray 灰色 #808080 128,128,128
　 DimGray 暗淡的灰色 #696969 105,105,105
　 Black 纯黑 #000000 0,0,0

原文地址：https://www.cnblogs.com/5H5H/p/9784015.html

时间： 2024-10-04 14:37:35

CSS中颜色表示方法及颜色表的相关文章

6st 关于颜色使用方法和颜色表

CSS中表示颜色有三种方法:     1.使用十六进制值设置的颜色  <对光源进行设置的最低值可以是 0(十六进制 00).最高值是 255(十六进制 FF).十六进制值使用三个双位数来编写,并以 # 符号开头.>     2.使用 rgb 值(红绿蓝颜色值)设置的颜色.RGB 颜色值是这样规定的:rgb(red, green, blue).每个参数 (red.green 以及 blue) 定义颜色的强度,可以是介于 0 与 255 之间的整数,或者是百分比值(从 0% 到 100%).rgb

原生js获取css中class的方法

function getByClass( className, context) { var context = context || document; if( context.getElementsByClassName) { return context.getElementsByClassName(className); } var nodes = context.getElementsByTagName("*"); ret=[]; for( var i=0; i<nod

css颜色表示法及颜色表

颜色表示法 一.直接输入CSS颜色的关键词,如red blue等. 二.十六进制值,如#0000. 三.RGB: rgb(255,0,0),这是给定的三个参数表示的红色,绿色和蓝色通道的颜色值每个通道不是由两个十六进制数字表示的,而是由0到255之间的十进制数表示的. 四.HSL:该hsl( )函数接受色相.饱和度以及明度值 色调:颜色的底色调.这个值在0到360之间,表示色轮周围的角度. 饱和度:饱和度是多少?这需要一个价值从0-100%,其中0是没有颜色(它将显示为灰色),100%是全彩色饱

CSS单位分析及CSS颜色表示法、颜色表（调色板）

CSS单位主要分析em.rem.fr这三个较难理解的单位吧,平常的px.%.cm那些就不谈了嘛. px在不同场景之下为同样的值,我们把它称作绝对单位,而em和rem受外部因素的影响下而改变,因此称作相对单位. 我们需要了解到为什么要拓展em,rem这样的相对单位呢? 比如我就特爱用px,感觉所有的东西都能用px来表现距离,而事实上这种做法早已跟不上时代的步伐了,随着更高分辨率的显示器出现,则需要原本的多栏定宽布局,则需要更加灵活多变的响应式布局. em是最常见的相对长度单位,这是排版中使用的一种

关于CSS中隐藏内容方法的思考

正在读<精通CSS>,很多样式需要用到内容隐藏,比如平时无内容,鼠标悬停时显示出内容.书中常用的方法是用text-indent:-1000em.margin-left:-1000em将元素隐藏到屏幕边缘之外,而display:none和visibility:hidden.overflow:hidden也可以做到隐藏,那么这几种用法有哪些利弊呢? 1.display:none; 搜索引擎可能认为被隐藏的元素属于垃圾信息而忽略,不利于SEO:屏幕阅读器会忽略被隐藏的元素. 2.visibility

CSS中水平居中的方法

居中是我们在css中经常遇到的问题,一般有水平居中.垂直居中.垂直水平居中这3种情况,那么今天首先就来对学习到的水平居中的方法做个总结笔记. css水平居中 text-align:center 为了看得更清楚,我们举一个例子,如图,我们将div2放入div1中,现在,如果我们想让文字在div2中水平居中,那么将它的父元素div2或者(div1)设置为text-align:center即可.因为text-align具有继承性,而且text-align它只对行内元素有效. 那么接下来,如果我们想让d

CSS颜色表示法、颜色表（调色板）

1.CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) 表示法进行定义.对光源进行设置的最低值可以是 0(十六进制 00).最高值是 255(十六进制 FF). 2.十六进制值使用三个双位数来编写,并以 # 符号开头. 3.RGB 颜色值表示:rgb(red, green, blue).每个参数 (red.green 以及 blue) 定义颜色的强度,可以是介于 0 与 255 之间的整数,或者是百分比值(从 0% 到 100%). 4.RGBA 表示:RGBA颜色值是 RG

web前端入门到实战：css中颜色

颜色 如果我们相给页面设置颜色可以采用多种方法进行设置: 一.命名颜色 假设在设置页面的颜色时觉得一部分很小的颜色集中就足够了,就可以直接给定颜色的名称.CSS称这些有名称的颜色为命名颜色. 命名颜色的关键字有限,css定义了17个标准色:浅绿色,黑色,蓝色,紫红色,灰色,橙色,绿色,石灰,栗色,海军,橄榄,紫,红,银,蓝绿色,白色和黄色. 有的时候也许使用其他颜色值,并不在标准颜色之内的颜色也可以使用,它之所以能起作用,原因是大多数的web浏览器能识别多达140个颜色,包括前面说的17种颜色.

CSS中各种居中方法

水平居中方法 1.行内元素居中 行内元素居中是只针对行内元素的,比如文本(text).图片(img).按钮等行内元素,可通过给父元素设置 text-align:center 来实现.另外,如果块状元素属性display 被设置为inline时,也是可以使用这种方法.但有个首要条件是子元素必须没有被float影响,否则一切都是无用功. 2.块状元素居中 (1)定宽块状元素居中 满足定宽(块状元素的宽度width为固定值)和块状两个条件的元素可以通过设置"左右margin"值为"