zl程序教程

您现在的位置是:首页 >  后端

当前栏目

js生成web安全色

JS安全Web 生成
2023-09-11 14:19:07 时间

256色里有40种颜色在Macintosh和Windows里显示的效果不一样,所以能安全使用的只有216色。

web安全色

 

[html] view plain copy
 
  1. <!DOCTYPE HTML>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8" />  
  5. <title> web安全色 </title>  
  6.     <meta name="keywords" content="" />  
  7.     <meta name="description" content="" />  
  8.     <style type="text/css">  
  9.     div{ color:#f60; font:12px/1.5 Georgia;}  
  10.     </style>  
  11. </head>  
  12. <body>  
  13.   
  14. <script type="text/javascript">  
  15.         window.onload = function()  
  16.         {  
  17.             var aColor = ['00','33','66','99','CC','FF'];  
  18.             var iLen = aColor.length;  
  19.             var i = 0;  
  20.             var j = 0;  
  21.             var iWidth = 100;  
  22.             var iHeight = 18;  
  23.             var iScreenX = (document.documentElement.clientWidth-iWidth*iLen)/2;  
  24.             var iScreenY = (document.documentElement.clientHeight-iHeight*iLen*iLen)/2;  
  25.               
  26.             for(var r = 0; r iLen; r++)  
  27.             {  
  28.                 for(var g = 0; g iLen; g++)  
  29.                 {  
  30.                     for(var b = 0; b iLen; b++)  
  31.                     {  
  32.                         var oDiv = document.createElement('div');  
  33.                         oDiv.style.width = iWidth+'px';   
  34.                         oDiv.style.height = iHeight+'px';   
  35.                         oDiv.style.position = 'absolute';  
  36.                         oDiv.style.left = (Math.floor(i/iLen)-Math.floor(i/36)*iLen)*iWidth+iScreenX+'px';  
  37.                         oDiv.style.top = (Math.floor(i/36)*iLen+(i%iLen))*iHeight+iScreenY+'px';  
  38.                         oDiv.innerHTML = oDiv.style.backgroundColor = '#'+aColor[r].toString()+aColor[g].toString()+aColor[b].toString();  
  39.                         document.body.appendChild(oDiv);  
  40.                         i++;  
  41.                     }  
  42.                 };  
  43.             };  
  44.         };  
  45. </script>  
  46. </body>  
  47. </html>