网页配色工具 —— 实用查询 - Powered By www.chadizhi.com

<HTML><HEAD> <TITLE>一流软体-网页配色工具</TITLE> <META http-equiv=Content-Type content="text/html; charset=gb2312"> <STYLE type=text/css> .drag{CURSOR: hand;POSITION: relative} .dra{CURSOR: hand;} td,div{font-size: 12px} input{background-color:transparent} a:visited,a:link{color:#002814;text-decoration: none} a:hover{color:#ddee33;background-color:#888888} input{border:0} </STYLE> </HEAD> <BODY id=all text=#000000 bgColor=#ffffff background=""  leftmargin="7" topmargin="7"> <table width="700" border="0"> <tr> <td width="406"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="355"> <table border="1" cellspacing="0" cellpadding="1" bordercolor="#cccccc" bgcolor="#f5f5f5" width="355"> <tr> <td colspan="2"> <input type=file size=25 name=uploadfile2 title="按游览选择图片,然后点背景图片"> <a href="javascript:bj()" title="按游览选择图片,然后点背景图片">背景图片</a> <a href="javascript:bl()" title="按此清除背景图片">清除</a>
<script language="JavaScript">
function selec(ssss){
ssss.select();document.execCommand("Copy")}
function bl(){all.background=""}
function bj(){if(uploadfile2.value==""){alert("请按左边的按钮选择一张图片作为背景");}
else{all.background=uploadfile2.value}}
</script>
</td> </tr> <tr> <td rowspan="2" align="center">改变内容选择<br> <input type="radio" name="vsss" value="ssss"> 字体 <input type="radio" name="vsss" value="vvv" checked> 背景</td> <td align="center"> 字体颜色 <input type="text" name="textfield2" size="8" value="#" maxlength="7"> <a href="javascript:selec(textfield2)">复制</a> <a href="javascript:fontc()">自定</a> </td> </tr> <tr> <td align="center"> 背景颜色 <input type="text" name="textfield4" size="8" value="#" maxlength="7"> <a href="javascript:selec(textfield4)">复制</a> <a href="javascript:backc()">自定</a> </td> </tr> </table> </td></tr><tr><td>  
<script language="JavaScript">
var showPerc=255;
var Color=new Array();
Color[0]="00";Color[1]="11";Color[2]="22";Color[3]="33";Color[4]="44";
Color[5]="55";Color[6]="66";Color[7]="77";Color[8]="88";Color[9]="99";
Color[10]="aa";Color[11]="bb";Color[12]="cc";Color[13]="dd";Color[14]="ee";
Color[15]="ff";Color[16]="ff";
var rVal,mowang
ta="<table class=dra width=\"380\" border=\"1\" cellspacing=\"0\" cellpadding=\"0\" bordercolor=\"#f6f6f6\">"
t=ta+"<tr>"
for (x=0;x<16;x++){
t+="<td onclick=mowanglijiang("+x+") bgcolor=\"#"+Color[x]+"ffff\"><CENTER>"+Color[x]+"</CENTER></td>"}
document.write(t+"</tr></table>")
function mowanglijiang(n){
textfield3.value=Color[n]
t=ta
for(x=0;x<16;x++){
t+="<tr>"
for (y=0;y<16;y++){t+="<td bgColor=\"#"+Color[n]+Color[x]+Color[y]+"\" onclick=amo(this)> </td>"
}t+="</tr>"}
b111.innerHTML=t+"</table>";t=""}
function bgc(n){
document.bgColor=n.bgColor
}
</script>
<div id="Layer1" style="position:absolute; width:32px; height:28px; z-index:11; left: 396px; top: 96px"> <input type="text" name="textfield3" size="3" maxlength="3"> </div>
</td> </tr> </table> </td> <td rowspan="2" valign="top" width="284"> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <div align="left" id=vs2 style="color: #003300"> <CENTER> <font size="3">说 明</font> </CENTER> <br> 本软件为网页调制颜色所用,可调网页背景颜色、字体颜色和背景图片，按左边的浏览来选择背景图片,然后按“背景图片”作为 确定。<br> 调字体与背景颜色请先选择。<br> 左边的字体与背景颜色值可自行改变，然后按自定颜色来确定。<br> 按复制颜色为直接复制颜色值<br> 点中间的“有关色彩”有部分色彩配制的资料和色彩配制方案。 </div> </td> </tr> <tr> <td height="39"><img class=drag id=knobImg onmousedown=vs2_126_com(this) style="Z-INDEX:3;LEFT: 127px; WIDTH:32px; TOP: 0px; HEIGHT:32px" src="js/latiao.gif"> <hr style="Z-INDEX:2;LEFT:6px;width:255;TOP:-28px;POSITION: relative"> </td> </tr> <tr> <td height="39"><img class=drag id=knobImg1 onmousedown=vs2_126_com(this) style="Z-INDEX:3;LEFT: 127px; WIDTH:32px; TOP: 0px; HEIGHT:32px" src="js/latiao.gif"> <hr style="Z-INDEX:2;LEFT:6px;width:255;TOP:-28px;POSITION: relative"> </td> </tr> <tr> <td height="39"><img class=drag id=knobImg2 onmousedown=vs2_126_com(this) style="Z-INDEX:3;LEFT: 127px; WIDTH:32px; TOP: 0px; HEIGHT:32px" src="js/latiao.gif"> <hr style="Z-INDEX:2;LEFT:6px;width:255;TOP:-28px;POSITION: relative"> </td> </tr> <tr> <td height="39">网页配色工具<br><br>   <a href="http://www.16z.com">一流站提供！<br> <font color="#FF0000"><strong>http://www.16z.com</strong> 
</font></a> 
</td> </tr> </table></td></tr><tr> <td width="406" height="2" id=b111> </td> </tr> <tr> <td colspan="2"> <table width="100%" border="0"> <tr> <td bgColor="#d9ecff" class=dra onclick="bgc(this)">背景颜色</td> <td bgColor="#000066" class=dra onclick="bgc(this)"><font color="#FFFFFF">直选</font></td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </table> </td> </tr> </table>
<script language="JavaScript">
var h=new Array(256);
h[0]="00";h[1]="01";h[2]="02";h[3]="03";h[4]="04";h[5]="05";h[6]="06";h[7]="07";h[8]="08";h[9]="09";h[10]="0A";h[11]="0B";h[12]="0C";h[13]="0D";h[14]="0E";h[15]="0F";h[16]="10";h[17]="11";h[18]="12";h[19]="13";h[20]="14";h[21]="15";h[22]="16";h[23]="17";h[24]="18";h[25]="19";h[26]="1A";h[27]="1B";h[28]="1C";h[29]="1D";h[30]="1E";h[31]="1F";h[32]="20";h[33]="21";h[34]="22";h[35]="23";h[36]="24";h[37]="25";h[38]="26";h[39]="27";h[40]="28";h[41]="29";h[42]="2A";h[43]="2B";h[44]="2C";h[45]="2D";h[46]="2E";h[47]="2F";h[48]="30";h[49]="31";h[50]="32";h[51]="33";h[52]="34";h[53]="35";h[54]="36";h[55]="37";h[56]="38";h[57]="39";h[58]="3A";h[59]="3B";h[60]="3C";h[61]="3D";h[62]="3E";h[63]="3F";h[64]="40";h[65]="41";h[66]="42";h[67]="43";h[68]="44";h[69]="45";h[70]="46";h[71]="47";h[72]="48";h[73]="49";h[74]="4A";h[75]="4B";h[76]="4C";h[77]="4D";h[78]="4E";h[79]="4F";h[80]="50";h[81]="51";h[82]="52";h[83]="53";h[84]="54";h[85]="55";h[86]="56";h[87]="57";h[88]="58";h[89]="59";h[90]="5A";h[91]="5B";h[92]="5C";h[93]="5D";h[94]="5E";h[95]="6F";h[96]="60";h[97]="61";h[98]="62";h[99]="63";h[100]="64";h[101]="65";h[102]="66";h[103]="67";h[104]="68";h[105]="69";h[106]="6A";h[107]="6B";h[108]="6C";h[109]="6D";h[110]="6E";h[111]="6F";h[112]="70";h[113]="71";h[114]="72";h[115]="73";h[116]="74";h[117]="75";h[118]="76";h[119]="77";h[120]="78";h[121]="79";h[122]="7A";h[123]="7B";h[124]="7C";h[125]="7D";h[126]="7E";h[127]="7F";h[128]="80";h[129]="81";h[130]="82";h[131]="83";h[132]="84";h[133]="85";h[134]="86";h[135]="87";h[136]="88";h[137]="89";h[138]="8A";h[139]="8B";h[140]="8C";h[141]="8D";h[142]="8E";h[143]="8F";h[144]="90";h[145]="91";h[146]="92";h[147]="93";h[148]="94";h[149]="95";h[150]="96";h[151]="97";h[152]="98";h[153]="99";h[154]="9A";h[155]="9B";h[156]="9C";h[157]="9D";h[158]="9E";h[159]="9F";h[160]="A0";h[161]="A1";h[162]="A2";h[163]="A3";h[164]="A4";h[165]="A5";h[166]="A6";h[167]="A7";h[168]="A8";h[169]="A9";h[170]="AA";h[171]="AB";h[172]="AC";h[173]="AD";h[174]="AE";h[175]="AF";h[176]="B0";h[177]="B1";h[178]="B2";h[179]="B3";h[180]="B4";h[181]="B5";h[182]="B6";h[183]="B7";h[184]="B8";h[185]="B9";h[186]="BA";h[187]="BB";h[188]="BC";h[189]="BD";h[190]="BE";h[191]="BF";h[192]="C0";h[193]="C1";h[194]="C2";h[195]="C3";h[196]="C4";h[197]="C5";h[198]="C6";h[199]="C7";h[200]="C8";h[201]="C9";h[202]="CA";h[203]="CB";h[204]="CC";h[205]="CD";h[206]="CE";h[207]="CF";h[208]="D0";h[209]="D1";h[210]="D2";h[211]="D3";h[212]="D4";h[213]="D5";h[214]="D6";h[215]="D7";h[216]="D8";h[217]="D9";h[218]="DA";h[219]="DB";h[220]="DC";h[221]="DD";h[222]="DE";h[223]="DF";h[224]="E0";h[225]="E1";h[226]="E2";h[227]="E3";h[228]="E4";h[229]="E5";h[230]="E6";h[231]="E7";h[232]="E8";h[233]="E9";h[234]="EA";h[235]="EB";h[236]="EC";h[237]="ED";h[238]="EE";h[239]="EF";h[240]="F0";h[241]="F1";h[242]="F2";h[243]="F3";h[244]="F4";h[245]="F5";h[246]="F6";h[247]="F7";h[248]="F8";h[249]="F9";h[250]="FA";h[251]="FB";h[252]="FC";h[253]="FD";h[254]="FE";h[255]="FF";

vs2.contentEditable=true;
textfield4.value=document.bgColor
textfield2.value=vs2.style.color
document.onmouseup=new Function("dragMe=false")
var rg=new Array(1,1,1);

function moveLaye() {
if (event.button==1 && dragMe){
oldY=kObj.style.pixelLeft;kObj.style.pixelLeft=temp2+event.clientX-yPos;
if (kObj.style.pixelLeft>oldY) direction=0; else direction=1;
if (kObj.style.pixelLeft<0 && direction==1){kObj.style.pixelLeft=0; direction=0;}
if (kObj.style.pixelLeft>255 && direction==0){kObj.style.pixelLeft=255;direction=1;}
rg[sss]=h[kObj.style.pixelLeft];
mowang="#"+rg[0]+rg[1]+rg[2]
vs2.style.color=mowang
textfield2.value=mowang
return false; }}

function moveLayer() {
if (event.button==1 && dragMe){
oldY=kObj.style.pixelLeft;kObj.style.pixelLeft=temp2+event.clientX-yPos;
if (kObj.style.pixelLeft>oldY) direction=0; else direction=1;
if (kObj.style.pixelLeft<0 && direction==1){kObj.style.pixelLeft=0; direction=0;}
if (kObj.style.pixelLeft>255 && direction==0){kObj.style.pixelLeft=255;direction=1;}
rg[sss]=h[kObj.style.pixelLeft];
mowang="#"+rg[0]+rg[1]+rg[2]
document.bgColor=mowang;textfield4.value=mowang
return false; }}

var sss
function vs2_126_com(lll){
dragMe=true;kObj=lll;temp2=kObj.style.pixelLeft; yPos=event.clientX;
cCol=document.bgColor;rg[0]=cCol.substr(1,2);rg[1]=cCol.substr(3,2);rg[2]=cCol.substr(5,2);
if (kObj.id=="knobImg") sss=0
if (kObj.id=="knobImg1") sss=1
if (kObj.id=="knobImg2") sss=2
if (vsss[1].checked){document.onmousemove=moveLayer}
else {document.onmousemove=moveLaye};}

function fontc(){
vs2.style.color=textfield2.value}
function backc(){
document.bgColor=textfield4.value}
function amo(n){
if (vsss[1].checked){document.bgColor=n.bgColor;textfield4.value=n.bgColor}
else{vs2.style.color=n.bgColor
textfield2.value=n.bgColor}}
mowanglijiang(0)
</script>
<div style="position:absolute; width:17px; height:12px; z-index:10; left: 399px; top: 180px; background-color:#ffaaee; layer-background-color:#ffaaee"> <CENTER><FONT COLOR="#FF0000">红</FONT></CENTER></div> <div style="position:absolute; width:17px; height:12px; z-index:10; left: 398px; top: 219px; background-color:#009944; layer-background-color: #009944"> <CENTER><FONT COLOR="#004400">绿</FONT></CENTER></div> <div style="position:absolute; width:17px; height:12px; z-index:10; left: 398px; top: 258px; background-color:#d9ecff; layer-background-color:#d9ecff"> <CENTER><FONT COLOR="#0000FF">蓝</FONT></CENTER></div> </BODY></HTML>