分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

出自 HTML4 规范的可用颜色字符串值列表

发布时间:2023-09-06 01:08责任编辑:林大明关键词:HTML

据称由于 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里显示了一下,确定没有问题,显示效果如下:

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

<!DOCTYPE html><html lang="utf-8"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><head> ????<title>出自 HTML4 规范的可用颜色字符串值列表</title> ???</head> ????<body onload="draw()"> ???????<canvas id="myCanvus" width="240px" height="470px" style="border:1px dashed black;"> ???????????出现文字表示你的浏览器不支持HTML5 ???????</canvas> ????</body></html><script type="text/javascript"><!--function draw(){ ???????var canvas=document.getElementById(‘myCanvus‘); ???????canvas.height=470; ???????canvas.width=240; ???????var context=canvas.getContext(‘2d‘); ????????context.fillStyle = "#88aacc"; ???????context.fillRect(0, 0, canvas.width, canvas.height); ???????var colors=[ ???????????{‘title‘:‘黑色‘, ????‘name‘:‘black‘,‘hex‘:‘#000000‘}, ???????????{‘title‘:‘绿色‘, ????‘name‘:‘green‘,‘hex‘:‘#008000‘}, ???????????{‘title‘:‘银色‘, ????‘name‘:‘silver‘,‘hex‘:‘#c0c0c0‘}, ???????????{‘title‘:‘青柠色‘, ‘name‘:‘lime‘,‘hex‘:‘#00ff00‘}, ???????????{‘title‘:‘灰色‘, ????‘name‘:‘gray‘,‘hex‘:‘#808080‘}, ???????????{‘title‘:‘白色‘, ????‘name‘:‘white‘,‘hex‘:‘#ffffff‘}, ???????????{‘title‘:‘黄色‘, ????‘name‘:‘yellow‘,‘hex‘:‘#ffff00‘}, ???????????{‘title‘:‘栗色‘, ????‘name‘:‘maroon‘,‘hex‘:‘#800000‘}, ???????????{‘title‘:‘海蓝色‘, ‘name‘:‘navy‘,‘hex‘:‘#000080‘}, ???????????{‘title‘:‘红色‘, ????‘name‘:‘red‘,‘hex‘:‘#ff0000‘}, ???????????{‘title‘:‘蓝色‘, ????‘name‘:‘blue‘,‘hex‘:‘#0000ff‘}, ???????????{‘title‘:‘紫色‘, ????‘name‘:‘purple‘,‘hex‘:‘#800080‘}, ???????????{‘title‘:‘蓝深绿色‘,‘name‘:‘teal‘,‘hex‘:‘#008080‘}, ???????????{‘title‘:‘紫红色‘, ?‘name‘:‘fuchsia‘,‘hex‘:‘#ff00ff‘}, ???????????{‘title‘:‘浅蓝绿色‘, ‘name‘:‘aqua‘,‘hex‘:‘#00ffff‘}, ??????]; ???????var x=10; ???????var y=0; ???????// 遍历JSON ??????for(var i=0; i<colors.length; i++) ???????{ ?????????????y+=30; ???????????var color=colors[i]; ???????????//alert(color.title+" -" + color.name+" -" + color.hex) ?????????????context.font="bold 16px 宋体"; ???????????context.fillStyle=color.name; ???????????context.fillText(color.title+"," + color.name+" ," + color.hex ,x,y); ?????} };//--></script>

2017年9月5日09:02:35

出自 HTML4 规范的可用颜色字符串值列表

原文地址:http://www.cnblogs.com/xiandedanteng/p/7476701.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved