js实现的网页颜色代码表全集

　　<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

　　<HTML><HEAD><TITLE>网页颜色代码全集</TITLE>

　　<STYLE type=text/css>TD {

　　FONT-SIZE: 10.8pt

　　}

　　BODY {

　　FONT-SIZE: 10.8pt

　　}

　　BUTTON {

　　WIDTH: 5em

　　}

　　</STYLE>

　　var SelRGB = '';

　　var DrRGB = '';

　　var SelGRAY = '120';

　　var hexch = new Array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F');

　　function ToHex(n)

　　{ var h, l;

　　n = Math.round(n);

　　l = n % 16;

　　h = Math.floor((n / 16)) % 16;

　　return (hexch[h] + hexch[l]);

　　}

　　function DoColor(c, l)

　　{ var r, g, b;

　　r = '0x' + c.substring(1, 3);

　　g = '0x' + c.substring(3, 5);

　　b = '0x' + c.substring(5, 7);

　　if(l > 120)

　　{

　　l = l - 120;

　　r = (r * (120 - l) + 255 * l) / 120;

　　g = (g * (120 - l) + 255 * l) / 120;

　　b = (b * (120 - l) + 255 * l) / 120;

　　}else

　　{

　　r = (r * l) / 120;

　　g = (g * l) / 120;

　　b = (b * l) / 120;

　　}

　　return '#' + ToHex(r) + ToHex(g) + ToHex(b);

　　}

　　function EndColor()

　　{ var i;

　　if(DrRGB != SelRGB)

　　{

　　DrRGB = SelRGB;

　　for(i = 0; i <= 30; i ++)

　　GrayTable.rows(i).bgColor = DoColor(SelRGB, 240 - i * 8);

　　}

　　SelColor.value = DoColor(RGB.innerText, GRAY.innerText);

　　ShowColor.bgColor = SelColor.value;

　　}

　　</SCRIPT>

　　SelRGB = event.srcElement.bgColor;

　　EndColor();

　　</SCRIPT>

　　RGB.innerText = event.srcElement.bgColor;

　　EndColor();

　　</SCRIPT>

　　RGB.innerText = SelRGB;

　　EndColor();

　　</SCRIPT>

　　SelGRAY = event.srcElement.title;

　　EndColor();

　　</SCRIPT>

　　GRAY.innerText = event.srcElement.title;

　　EndColor();

　　</SCRIPT>

　　GRAY.innerText = SelGRAY;

　　EndColor();

　　</SCRIPT>

　　window.returnValue = SelColor.value;

　　window.close();

　　</SCRIPT>

　　</HEAD>

　　<p><font color="#FF0000" size="5"><strong><a href="http://www.zhaozi.cn"><font color="#FF6600">找字网</font></a>网页颜色代

　　码选择器</strong></font></p>

　　</DIV>

　　<TABLE cellSpacing=1 cellPadding=3 width=350 align=center bgColor=#dddddd

　　border=0>

　　<TBODY>

　　<TD align=middle width="10%"><SELECT onchange=selectchg(this.value)

　　name=select1> <OPTION value=1 selected>红</OPTION> <OPTION

　　value=2>绿</OPTION> <OPTION value=3>蓝</OPTION> <OPTION

　　value=4>灰</OPTION></SELECT> </TD>

　　<TBODY>

　　<TR>

　　<TD width="81%" align=right>颜色值

　　</TD>

　　<TABLE class=cursorcross height=20 cellSpacing=1 cellPadding=0

　　width=40 border=0>

　　<TBODY>

　　<TR>

　　<TD id=customcolor onmouseover=showcolor(this)

　　bgColor=#ffffff> </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR>

　　<TABLE class=cursorhand id=tableleft cellSpacing=1 cellPadding=0

　　border=0><SCRIPT language=VBScript>

　　function hexit(which)

　　hexit=hex(which)

　　end function

　　</SCRIPT>

　　for(i=0;i<=15;++i)

　　{document.write('<tr><td align="center">'+ hexit(0+i*17) +'</td><td id="tdleft' + i +'" bgcolor="rgb('+ (0+i*17) + ',0,0)"

　　width="15" height="15" onclick="changeright(this.num)" onmouseover="showcolor(this)"></td></tr>')

　　document.all['tdleft' + i].num=i

　　}

　　</SCRIPT>

　　<TABLE class=cursorcross id=tableleft cellSpacing=1 cellPadding=0

　　border=0>

　　document.write('<tr><td></td>')

　　for(i=0;i<=15;++i)

　　{document.write('<td align="center">'+ hexit(0+i*17) +'</td>')}

　　document.write('</tr>')

　　for(i=0;i<=15;++i)

　　{document.write('<tr>')

　　document.write('<td align="center">'+ hexit(0+i*17) +'</td>')

　　for(j=0;j<=15;++j)

　　{document.write('<td id="tdrightr' + i + 'c' + j +'" bgcolor="rgb(0,'+ (0+i*17) + ',' + (0+j*17) + ')" width="15"

　　height="15" onmouseover="showcolor(this)" onclick="clickright(this)"></td>')}

　　document.write('</tr>')

　　}

　　</SCRIPT>

　　<TD colSpan=2

　　height=20>·可选16*16*16种颜色。<BR>·单击左边的颜色会得到更多的颜色。<BR>·单击右边的颜色会固定选取的颜色。

　　<BR>·输入框可以自定义颜色。</TD></TR></TBODY></TABLE>

　　function selectchg(which)

　　{switch(which)

　　{case '1' :leftR();break;

　　case '2' :leftG();break;

　　case '3' :leftB();break;

　　case '4' :leftA();break;

　　}

　　function leftR()

　　{for(i=0;i<=15;++i)

　　{document.all['tdleft'+i].bgColor='rgb('+ (0+i*17) + ',0,0)'}

　　rightR(0)

　　}

　　function leftG()

　　{for(i=0;i<=15;++i)

　　{document.all['tdleft'+i].bgColor='rgb(0,'+ (0+i*17) + ',0)'}

　　rightG(0)

　　}

　　function leftB()

　　{for(i=0;i<=15;++i)

　　{document.all['tdleft'+i].bgColor='rgb(0,0,'+ (0+i*17) + ')'}

　　rightB(0)

　　}

　　function leftA()

　　{for(i=0;i<=15;++i)

　　{document.all['tdleft'+i].bgColor='rgb('+ (0+i*17) + ','+ (0+i*17) + ','+ (0+i*17) + ')'}

　　rightA()

　　}

　　function rightR(which)

　　{for(i=0;i<=15;++i)

　　{for(j=0;j<=15;++j)

　　{document.all['tdrightr' + i + 'c' + j].bgColor='rgb(' + (0+which*17) + ',' + (0+i*17) + ','+ (0+j*17) + ')'}

　　}

　　function rightG(which)

　　{for(i=0;i<=15;++i)

　　{for(j=0;j<=15;++j)

　　{document.all['tdrightr' + i + 'c' + j].bgColor='rgb(' + (0+i*17) + ',' + (0+which*17) + ',' + (0+j*17) + ')'}

　　}

　　function rightB(which)

　　{for(i=0;i<=15;++i)

　　{for(j=0;j<=15;++j)

　　{document.all['tdrightr' + i + 'c' + j].bgColor='rgb(' + (0+i*17) + ','+ (0+j*17)+ ',' + (0+which*17) + ')'}

　　}

　　function rightA()

　　{for(i=0;i<=15;++i)

　　{for(j=0;j<=15;++j)

　　{document.all['tdrightr' + i + 'c' + j].bgColor='rgb(' + (0+i*16+j) + ','+ (0+i*16+j)+ ',' + (0+i*16+j) + ')'}

　　}

　　var rightclicked=false

　　function clickright(which)

　　{if(rightclicked){rightclicked=false;showcolor(which)}else{rightclicked=true}

　　}

　　function changeright(which)

　　{switch(select1.value)

　　{case '1' :rightR(which);break;

　　case '2' :rightG(which);break;

　　case '3' :rightB(which);break;

　　}

　　function showcolor(which)

　　{if(rightclicked)return;

　　text1.value=which.bgColor

　　choosecolor()

　　}

　　function choosecolor()

　　{customcolor.bgColor=text1.value

　　}

　　</SCRIPT>

　　</CENTER></DIV>

　　</CENTER></DIV>

　　<P align=center><B><font color="#FF0000" size="5">网页颜色代码对照表</font></B></P>

　　<TBODY>

　　<TR>

　　<TD>#FFFFFF</TD>

　　<TD>#FFFFF0</TD>

　　<TD>#FFFFE0</TD>

　　<TR>

　　<TD>#FFFAFA</TD>

　　<TD>#FFFAF0</TD>

　　<TD>#FFFACD</TD>

　　<TR>

　　<TD>#FFEFDB</TD></TR>

　　<TR>

　　<TD>#FFEFD5</TD>

　　<TD>#FFEBCD</TD>

　　<TR>

　　<TR>

　　<TD>#FFDEAD</TD>

　　<TD>#FFDAB9</TD>

　　<TR>

　　<TD>#FFBBFF</TD></TR>

　　<TR>

　　<TD>#FFAEB9</TD></TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#FCFCFC</TD>

　　<TD>#FAFAFA</TD>

　　<TD>#FAFAD2</TD></TR>

　　<TR>

　　<TD>#FAEBD7</TD>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#EEEEE0</TD>

　　<TD>#EEEED1</TD></TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#EEDFCC</TD>

　　<TR>

　　<TD>#EECFA1</TD>

　　<TD>#EECBAD</TD></TR>

　　<TR>

　　<TR>

　　<TD>#EEAEEE</TD>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#EDEDED</TD>

　　<TD>#EBEBEB</TD></TR>

　　<TR>

　　<TD>#EAEAEA</TD>

　　<TR>

　　<TR>

　　<TD>#DEDEDE</TD></TR>

　　<TR>

　　<TD>#DCDCDC</TD>

　　<TR>

　　<TD>#DBDBDB</TD>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#CFCFCF</TD></TR>

　　<TR>

　　<TD>#CDCDC1</TD>

　　<TD>#CDCDB4</TD>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#CCCCCC</TD></TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#BFEFFF</TD></TR>

　　<TR>

　　<TD>#BFBFBF</TD>

　　<TD>#BEBEBE</TD>

　　<TD>#BDBDBD</TD></TR>

　　<TR>

　　<TR>

　　<TD>#BBFFFF</TD>

　　<TD>#BABABA</TD>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#AEEEEE</TD>

　　<TR>

　　<TD>#ADADAD</TD>

　　<TD>#ABABAB</TD>

　　<TD>#AAAAAA</TD></TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#8DEEEE</TD>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TD>#5CACEE</TD></TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<TR>

　　<P align=center><IFRAME border=0 name=I1 align=middle

　　src="img/color1.htm" frameBorder=0 width=760 scrolling=no

　　height=954>

　　浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。</IFRAME></P>

　　<P align=center><IFRAME border=0 name=I2 align=center

　　src="img/color2.htm" frameBorder=0 width=641 scrolling=no

　　height=573>

　　浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。</IFRAME></P>

　　<P align=center><IFRAME border=0 name=I3 align=center

　　src="img/color3.htm" frameBorder=0 width=960 scrolling=no

　　height=4754>

　　浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。</IFRAME></P>

　　<P align=center><IFRAME border=0 name=I4 align=center

　　src="img/color4.htm" frameBorder=0 width=960 scrolling=no

　　height=4930>

　　浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。</IFRAME></P>

教程首页更多教程