据称由于 HTML5 没有修改专属的颜色，HTML4 的颜色都可以在 HTML5 中正确显示。

出自 HTML4 规范的可用颜色字符串值列表如下，此表来源是 http://www.lovean.com/view-3-132910-0.html , 我把原表中的“石灰色”修改成了“青柠色”，因为这更符合该颜色的原意（原表中把lime翻译成石灰色不知怎么回事）。另外原表是图片格式的，不方便拷贝，下表是文本格式的，可以直接拷贝使用。

序号 汉字名称 英语名称 十六进制颜色值
1 黑色 black #000000
2 绿色 green #008000
3 银色 silver #c0c0c0
4 青柠色 lime #00ff00
5 灰色 gray #808080
6 白色 white #ffffff
7 黄色 yellow #ffff00
8 栗色 maroon #800000
9 海蓝色 navy #000080
10 红色 red #ff0000
11 蓝色 blue #0000ff
12 紫色 purple #800080
13 蓝深绿色 teal #008080
14 紫红色 fuchsia #ff00ff
15 浅蓝绿色 aqua #00ffff

因为网络文章不是那么可信，有必要自己验证一下，于是我将这些颜色在Canvas里显示了一下，确定没有问题，显示效果如下：

显示这些颜色的代码如下：

  1. <!DOCTYPE html>
  2. <html lang="utf-8">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  4. <head>
  5.      <title>出自 HTML4 规范的可用颜色字符串值列表</title>
  6.     </head>
  7.  
  8.      <body onload="draw()">
  9.         <canvas id="myCanvus" width="240px" height="470px" style="border:1px dashed black;">
  10.             出现文字表示你的浏览器不支持HTML5
  11.         </canvas>
  12.      </body>
  13. </html>
  14. <script type="text/javascript">
  15. <!--
  16. function draw(){
  17.  
  18.         var canvas=document.getElementById('myCanvus');
  19.         canvas.height=470;
  20.         canvas.width=240;
  21.         var context=canvas.getContext('2d');
  22.          context.fillStyle = "#88aacc";
  23.         context.fillRect(0, 0, canvas.width, canvas.height);
  24.  
  25.         var colors=[
  26.             {'title':'黑色',     'name':'black','hex':'#000000'},
  27.             {'title':'绿色',     'name':'green','hex':'#008000'},
  28.             {'title':'银色',     'name':'silver','hex':'#c0c0c0'},
  29.             {'title':'青柠色', 'name':'lime','hex':'#00ff00'},
  30.             {'title':'灰色',     'name':'gray','hex':'#808080'},
  31.             {'title':'白色',     'name':'white','hex':'#ffffff'},
  32.             {'title':'黄色',     'name':'yellow','hex':'#ffff00'},
  33.             {'title':'栗色',     'name':'maroon','hex':'#800000'},
  34.             {'title':'海蓝色', 'name':'navy','hex':'#000080'},
  35.             {'title':'红色',     'name':'red','hex':'#ff0000'},
  36.             {'title':'蓝色',     'name':'blue','hex':'#0000ff'},
  37.             {'title':'紫色',     'name':'purple','hex':'#800080'},
  38.             {'title':'蓝深绿色','name':'teal','hex':'#008080'},
  39.             {'title':'紫红色',  'name':'fuchsia','hex':'#ff00ff'},
  40.             {'title':'浅蓝绿色', 'name':'aqua','hex':'#00ffff'},
  41.        ];
  42.  
  43.         var x=10;
  44.         var y=0;
  45.         // 遍历JSON
  46.        for(var i=0; i<colors.length; i++)
  47.       {
  48.             y+=30;
  49.             var color=colors[i];
  50.             //alert(color.title+" -" + color.name+" -" + color.hex)  
  51.  
  52.             context.font="bold 16px 宋体";
  53.             context.fillStyle=color.name;
  54.             context.fillText(color.title+"," + color.name+" ," + color.hex ,x,y);
  55.       }
  56. };
  57.  
  58. //-->
  59. </script>

2017年9月5日09:02:35

出自 HTML4 规范的可用颜色字符串值列表（常用颜色名称及对应的十六进制值）的更多相关文章

  1. python3 字符串与列表常用功能

    一.字符串常用功能 1. capitalize(),将字符串的首字母变成大写,其余全部置为小写:如果字符串中有多个单词,也只是将第一个单词的首字母置为大写:例: >>> name = ...

  2. python 数字、字符串、列表常用函数

    一.数字的标准类型: cmp():比较两个数的大小:返回值(-1,0,1). str():数字转化成字符串. type():返回数字类型. 转换工厂函数: int(obj,base=10) long( ...

  3. XmlException: 名称不能以“<”字符(十六进制值 0x3C)开头

    svn 版本冲突引起的: 产看config 文件里面的内容是否冲突,这个问题可能和代码无关

  4. [Swift通天遁地]五、高级扩展-(10)整形、浮点、数组、字典、字符串、点、颜色、图像类的实用扩展

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  5. 将十六进制的颜色字符串转为UIColor

    扩展UIColor,将十六进制的颜色字符串转成UIColor对象. extension UIColor { static func colorWithHexString(hex:String) -&g ...

  6. 常用icon以及color颜色RGB值和对应颜色效果图

    Android谷歌官方扁平化设计常用icon集合   Android谷歌官方扁平化设计color颜色RGB值和对应颜色效果图.

  7. 【转】YUV值对应的颜色

    版权声明:本文为博主原创文章,未经博主允许不得转载.欢迎大家积极评论,博主会一一答复! 最近有人在网上问我,YUV的值对应的颜色是如何的 下面给出YUV值对应的颜色关系 256张图512x512,每张 ...

  8. .net MVC 使用 JSON JavaScriptSerializer 进行序列化或反序列化时出错，字符串的长度超过了为 maxJsonLength 属性设置的值

    在.net mvc的controller中,方法返回JsonResult,一般我们这么写: [HttpPost] public JsonResult QueryFeature(string url, ...

  9. C# GetValueList 获得字符串中开始和结束字符串中间得值列表

    /// <summary> /// 获得字符串中开始和结束字符串中间得值列表 /// </summary> /// <param name="styleCont ...

随机推荐

  1. [译]从列表或字典创建Pandas的DataFrame对象

    原文来源:http://pbpython.com/pandas-list-dict.html 介绍 每当我使用pandas进行分析时,我的第一个目标是使用众多可用选项中的一个将数据导入Pandas的D ...

  2. 团队Alpha版本冲刺（三）

    目录 组员情况 组员1(组长):胡绪佩 组员2:胡青元 组员3:庄卉 组员4:家灿 组员5:凯琳 组员6:丹丹 组员7:家伟 组员8:政演 组员9:鸿杰 组员10:刘一好 组员11:何宇恒 展示组内最 ...

  3. Linux系统基础优化总结

    请称呼我搬运工,哈哈 优化综合 https://www.cnblogs.com/yinshoucheng-golden/p/6149556.html (1)不用root管理,以普通用户的名义通过sud ...

  4. 解决报错DEFAULT_INCOMPATIBLE_IMPROVEMENTS

    freemarker整合springMVC报错如下:警告: Exception encountered during context initialization - cancelling refre ...

  5. rmmod: can't change directory to “3.4.79+”，no such file or directory

    直接在/lib/modules目录下,在该目录下建立3.4.79+这个文件夹即可

  6. 共鸣（resonance）

    共鸣(resonance) 题目描述 GHQ通过在24区引起基因组共鸣,从而引发了第二次失落的圣诞. 24区的地图可以视为一个二维平面.GHQ在24区布置了m架发射塔,而葬仪社也建立了n个据点.要阻止 ...

  7. Codeforces 2014-2015 ACM-ICPC, NEERC, Southern Subregional Contest L. Useful Roads

    L. Useful Roads time limit per test:4 seconds memory limit per test:512 megabytes input:standard inp ...

  8. Codeforces Round #393 (Div. 2)

    A. Petr and a calendar time limit per test:2 seconds memory limit per test:256 megabytes input:stand ...

  9. NOIP2015提高组T2 洛谷P2661 信息传递

    题目描述 有n个同学(编号为1到n)正在玩一个信息传递的游戏.在游戏里每人都有一个固定的信息传递对象,其中,编号为i的同学的信息传递对象是编号为Ti同学. 游戏开始时,每人都只知道自己的生日.之后每一 ...

  10. 【HDOJ5977】Garden of Eden（点分治）

    题意:给定一棵n个点的树,每个节点上有一种颜色a[i],一共有k种颜色,问包含所有颜色的路径条数 n<=5e4,k<=10 思路:点分治求方案数 集合并卷积的时候暴力枚举状态即可O(n^l ...