CSS 颜色

可以用以下方法来规定 CSS 中的颜色:

  • ·        十六进制色

    • 十六进制值使用三个双位数来编写,并以 # 符号开头。
  • ·        RGB 颜色

o   所有浏览器都支持 RGB 颜色值。

o   RGB 颜色值是这样规定的:rgb(red, green, blue)。每个参数 (red、green 以及 blue) 定义颜色的强度,可以是介于 0 与 255 之间的整数,或者是百分比值(从 0% 到 100%)。

o   举例说,rgb(0,0,255) 值显示为蓝色,这是因为 blue 参数被设置为最高值(255),而其他被设置为 0。

  • ·        RGBA 颜色

o   所有浏览器都支持 RGB 颜色值。

o   RGB 颜色值是这样规定的:rgb(red, green, blue)。每个参数 (red、green 以及 blue) 定义颜色的强度,可以是介于 0 与 255 之间的整数,或者是百分比值(从 0% 到 100%)。

o   举例说,rgb(0,0,255) 值显示为蓝色,这是因为 blue 参数被设置为最高值(255),而其他被设置为 0。

  • ·        HSL 颜色

o   HSL 颜色值得到以下浏览器的支持:IE9+、Firefox、Chrome、Safari 以及 Opera 10+。

o   HSL 指的是 hue(色调)、saturation(饱和度)、lightness(亮度) - 表示颜色柱面坐标表示法。

o   HSL 颜色值是这样规定的:hsl(hue, saturation, lightness)。

o   Hue 是色盘上的度数(从 0 到 360) - 0 (或 360) 是红色,120 是绿色,240 是蓝色。Saturation 是百分比值;0% 意味着灰色,而 100% 是全彩。Lightness 同样是百分比值;0% 是黑色,100% 是白色。

  • ·        HSLA 颜色

o   HSLA 颜色值得到以下浏览器的支持:IE9+、Firefox 3+、Chrome、Safari 以及 Opera 10+。

o   HSLA 颜色值是 HSL 颜色值的扩展,带有一个 alpha 通道 - 它规定了对象的不透明度。

o   HSLA 颜色值是这样规定的:hsla(hue, saturation, lightness, alpha),其中的 alpha 参数定义不透明度。alpha 参数是介于 0.0(完全透明)与 1.0(完全不透明)的数字。

  • ·        预定义/跨浏览器颜色名
  • 颜色码对照表
颜色 英文代码 形象描述 十六进制 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

CSS颜色的更多相关文章

  1. 【CSS进阶】CSS 颜色体系详解

    说到 CSS 颜色,相比大家都不会陌生,本文是我个人对 CSS 颜色体系的一个系统总结与学习,分享给大家. 先用一张图直观的感受一下与 CSS 颜色相关大概覆盖了哪些内容. 接下来的行文内容大概会按照 ...

  2. CSS颜色代码

    颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) 表示法进行定义.对光源进行设置的最低值可以是 0(十六进制 00).最高值是 255(十六进制 FF).从 0 到 25 ...

  3. 第 14 章 CSS 颜色与度量单位

    学习要点: 1.颜色表方案 2.度量单位 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 颜色和度量单位等问题,包括颜色的选取方式.相对长度和绝对长度等. 一.颜色表方案 颜色的表现形式主要有 ...

  4. CSS 颜色代码大全

    CSS颜色: 转载:http://www.cnblogs.com/axing/archive/2011/04/09/CSS.html

  5. CSS颜色代码 颜色值 颜色名字大全(转载)

    CSS颜色代码 颜色值 颜色名字大全 转载处http://flyjj.com/css-colour-code.html 颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) ...

  6. CSS颜色代码大全

    CSS颜色代码大全 转载:http://blog.163.com/wujinhongisme@126/blog/static/3613698020095115919389/ RGB ( Red,Gre ...

  7. 第七十六节,css颜色和透明度,盒子阴影和轮廓,光标样式

    css颜色和透明度,盒子阴影和轮廓,光标样式 学习要点: 1.颜色和透明度 2.盒子阴影和轮廓 3.光标样式 一.颜色和透明度 颜色我们之前其实已经用的很多了,比如字体颜色.背景颜色.边框颜色.但除了 ...

  8. 第七十一,CSS颜色与度量单位

    CSS颜色与度量单位 学习要点: 1.颜色表方案 2.度量单位 本章主要探讨HTML5中CSS颜色和度量单位等问题,包括颜色的选取方式.相对长度和绝对长度等.   一.颜色表方案 1 颜色的表现形式主 ...

  9. (转)CSS颜色及<a>标签超链接颜色改变

    CSS颜色大全 <a>标签超链接颜色改变 A:hover   {BACKGROUND-COLOR:   #ffccff;   COLOR:   #0080ff}     (hover表示鼠 ...

  10. CSS颜色代码 颜色值 颜色名字大全

    颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) 表示法进行定义.对光源进行设置的最低值可以是 0(十六进制 00).最高值是 255(十六进制 FF).从 0 到 25 ...

随机推荐

  1. Spring Boot之默认连接池配置策略

    注意:如果我们使用spring-boot-starter-jdbc 或 spring-boot-starter-data-jpa “starters”坐标,Spring Boot将自动配置Hikari ...

  2. 20171205xlVBA往返航班组合

    'ClassPlan Public Org As String Public Des As String Public FlyNo As String Public StartDate As Vari ...

  3. 圆的变化(自定义动画,及自定义UI)

    之前在面试的时候被问到过一个问题,如何实现一个圆沿着一条线由大到小 当时回答的含糊不清,现在已经明白怎么去实现 关键点:Paint,path,canvas 一种方法 在activity中去控制圆的x, ...

  4. jquery判断设备是否是手机

    //判断是否是手机 function IsMobile() { var isMobile = { Android: function () { return navigator.userAgent.m ...

  5. 小程序授权demo

    <button wx:if="{{canIUse}}"   open-type="getUserInfo"  bindgetuserinfo=" ...

  6. [java]转:String Date Calendar之间的转换

    String Date Calendar之间的转换 String Date Calendar  1.Calendar 转化 String Calendar calendat = Calendar.ge ...

  7. element-ui radio 再次点击取消选中

    <el-radio-group v-model="radio2"> <el-radio @click.native.prevent="clickitem ...

  8. 设备指纹(Device Fingerprinting)是什么?

    简单来讲,设备指纹是指可以用于标识出该设备的设备特征或者独特的设备标识.设备指纹因子通常包括计算机的操作系统类型,安装的各种插件,浏览器的语言设置及其时区 .设备的硬件ID,手机的IMEI,电脑的网卡 ...

  9. python中RabbitMQ的使用(路由键)

    1.简介 当我们希望每个接收端接收各自希望的消息时,我们可以使用路由键,此时交换机的类型为direct. 2.工作原理 每个接收端的消息队列在绑定交换机的时候,可以设定相应的路由键. 发送端通过交换机 ...

  10. noip2014无线网络发射器选址

    题目描述 随着智能手机的日益普及,人们对无线网的需求日益增大.某城市决定对城市内的公共场所覆盖无线网. 假设该城市的布局为由严格平行的 129 条东西向街道和 129 条南北向街道所形成的网格状,并且 ...