站内搜索: 请输入搜索关键词

当前页面: 开发资料首页Javascript 专题用JavaScript脚本制作自己的色谱图

用JavaScript脚本制作自己的色谱图

摘要: 用JavaScript脚本制作自己的色谱图
<tr> <td>

  网站用色是网站建设必须认真考虑的重要问题。网站的色彩运用往往能够体现一个网站的特色和艺术风格。因此,在设计网页时常常需要设置网页背景或其它网页元素的颜色,而网页设计软件(如Dreamweaver)的调色板一般只有200多种色样供选择。如果你在设计网页时比较考究用色,可以使用JavaScript脚本制作自己的色谱,这将给你的设计工作带来很大的方便。

  显示色谱图的HTML代码和JavaScript脚本如下:

<textarea class=fm id=code5 rows=12 cols=78> <head> 色谱图 </head> <body BGCOLOR="#FFFFFF">

512色色谱图

<script LANGUAGE="JavaScript"> //定义数组对象 clr=new Array('00','20','40','60','80','a0','c0','ff'); //创建8个8行8列的表格 for (i=0;i<8;i++) { //创建表格,单元格内填充距8像素 document.write("<table border=1 cellpadding=8>"); for (j=0;j<8;j++) { document.write("<tr>"); for (k=0;k<8;k++) { //设置表格单元的背景颜色 document.write('<td bgcolor="#'+clr[i]+clr[j]+clr[k]+'">'); //设置文字颜色 document.write(' '); //显示16进制颜色值 document.write('#'+clr[i]+clr[j]+clr[k]+' </td>'); } document.write("</tr>"); } document.write("</table>
"); } </script>
</body> </textarea>

<input style="CURSOR: hand" onfocus=this.blur() onclick="runEx('code5')" type=button value=运行代码> <input style="WIDTH: 95px; CURSOR: hand" onfocus=this.blur() onclick=cycode(code5) type=button value=复制到剪贴板 name=Submit> <input style="CURSOR: hand" onfocus=this.blur() onclick=svcode(code5) type=button value=另存代码> [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

  点击运行代码即可看到512色色谱图。色谱图由8个表格组成,每个表格为64种颜色。应用时,复制你在色谱图中选定的颜色上的16进制颜色值,粘贴到颜色代码框中即可。

</td> </tr> </table>
↑返回目录
前一篇: 美丽网页特效及其代码汇编
后一篇: WEB程序开发常用小工具包