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

  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. <script type="text/javascript">
  14. window.onload = function()
  15. {
  16. var aColor = ['00','33','66','99','CC','FF'];
  17. var iLen = aColor.length;
  18. var i = 0;
  19. var j = 0;
  20. var iWidth = 100;
  21. var iHeight = 18;
  22. var iScreenX = (document.documentElement.clientWidth-iWidth*iLen)/2;
  23. var iScreenY = (document.documentElement.clientHeight-iHeight*iLen*iLen)/2;
  24. for(var r = 0; r < iLen; r++)
  25. {
  26. for(var g = 0; g < iLen; g++)
  27. {
  28. for(var b = 0; b < iLen; b++)
  29. {
  30. var oDiv = document.createElement('div');
  31. oDiv.style.width = iWidth+'px';
  32. oDiv.style.height = iHeight+'px';
  33. oDiv.style.position = 'absolute';
  34. oDiv.style.left = (Math.floor(i/iLen)-Math.floor(i/36)*iLen)*iWidth+iScreenX+'px';
  35. oDiv.style.top = (Math.floor(i/36)*iLen+(i%iLen))*iHeight+iScreenY+'px';
  36. oDiv.innerHTML = oDiv.style.backgroundColor = '#'+aColor[r].toString()+aColor[g].toString()+aColor[b].toString();
  37. document.body.appendChild(oDiv);
  38. i++;
  39. }
  40. };
  41. };
  42. };
  43. </script>
  44. </body>
  45. </html>

js生成web安全色的更多相关文章

  1. 利用JS动态生成隔行换色HTML表格

    用JS生成动态生成表格,行.列由用户输入,并使表格隔行换色 方法一. 代码: <!DOCTYPE html> 2 <html> 3 <head> 4 <tit ...

  2. 使用css3和javascript开发web拾色器实例

    本实例中的web拾色器功能使用css3实现页面效果,即在页面上显示的元素用css3样式来实现的.再使用js生成拾色器颜色数据,并控制各元素的鼠标事件.当事件作为反应时,获取到对应的数据并显示颜色值. ...

  3. 快速使用node.js进行web开发

    首先关于node.js的学习,这里推荐一本比较好的教程,nodejs web开发指南,该书通俗易懂地将node.js语言特性讲解完之后,又从一个项目角度带领读者使用node.js学习web开发.相信这 ...

  4. Beaglebone Black– 智能家居控制系统 LAS - 网页服务器 Node.js 、Web Service、页面 和 TCP 请求转 UDP 发送

    上一篇,纯粹玩 ESP8266,写入了 init.lua 能收发 UDP.这次拿 BBB 开刀,用 BBB host 一个 web server ,用于与用户交互,数据来自 ESP8266 的 UDP ...

  5. JS实现Web网页打印功能（IE）

    问题描述:     JS实现Web网页打印功能 问题解决:     这里主要使用WebBrowser控件的ExeWB在IE中打印功能的实现 WebBrowser介绍:         WebBrows ...

  6. 如何用python抓取js生成的数据 - SegmentFault

    如何用python抓取js生成的数据 - SegmentFault 如何用python抓取js生成的数据 1赞 踩 收藏 想写一个爬虫,但是需要抓去的的数据是js生成的,在源代码里看不到,要怎么才能抓 ...

  7. 二维码js生成库

    jr-qrcode 把字符串生成二维码,并以Base64 URL形式输出. 支持白色二维码,即反色二维码. 兼容性 插件使用了H5的canvas特性进行二维码绘制,最后输出base64 url,因此本 ...

  8. 搭建Node.js的Web框架egg.js

    1 egg.js的Request处理流程: 2. 使用nodejs下载egg.js框架 (1)现在nodejs中全局安装egg-init 即在nodejs安装根目录下执行  : d:cd nodejs ...

  9. js生成pdf报表

    由于前台html已经动态生成报表,而且,前台有一个功能,一个date range组件,当你拖动的时候,报表会在不提交到后台的情况下动态变化.因此需要用到js生成生报表: 用到的组件: jquery.j ...

随机推荐

  1. 金典 SQL笔记(6)

    page223-索引 --利用SQL 语句创建索引 --CREATE INDEX 索引名称on 表名(字段 ,字段, 字段字段n) --索引名称必须为唯一的,字段 ,字段, 同意一个到多个 --范例为 ...

  2. linux (debian) 配置静态ip

    在局域网内使用动态ip分配,机器动态的获取 ip地址.可是我使用ssh登录的时候.总是断线. 后来发现,原来机器总是在两个ip地址192.168.2.203 和192.168.2.228之间切换.用s ...

  3. HDU 5311 Sequence

    Hidden String Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Others) ...

  4. 将canvas画布内容转化为图片（toDataURL()，创建url）

    将canvas画布内容转化为图片(toDataURL(),创建url) 总结 1.现在的浏览器都支持右键另存为图片的方法来将canvas画布内容转化为图片 2.在代码里面可以通过toDataURL() ...

  5. vs2010打开vs2012项目

    修改.sln文件的前两行 修改前: Microsoft Visual Studio Solution File, Format Version 12.00 # Visual Studio 2012 修 ...

  6. Rails 服务器架设失败问题

    更新: 2017/09/14 补充了简单的确认号码的方法 A server is already running. Check /Users/...../pids/server.pid. Exitin ...

  7. 微信小程序连接Java后台

    有人问我小程序怎么连后台,这里直接贴代码 在app.js里 // api request request(url, params) { return new Promise((resolve, rej ...

  8. Python/Django 下载Excel2007

    一.前提 上一篇,我写了下载Excel2003的博文,这里写下载Excel2007的博文的原因有三: 第一.Excel2003基本已经淘汰了 第二.Excel2003下载文件太大,不利于网络传输 第三 ...

  9. idea git项目修改后无法提交 颜色都是灰色

    现象: idea git项目修改后无法提交   修改后的文件提交时不显示  颜色都是灰色 分析问题出现的原因: git未识别idea下项目. 排查: 发现是因为这个项目之前是基于svn的,然后直接导入 ...

  10. T4模板使用记录，生成Model、Service、Repository

    自己目前在搭建一个.NET Core的框架,本来是打算使用前端做代码生成器直接生成到文件的,快做好了.感觉好像使用T4更方便一些,所以也就有了这篇文章~  我还是有个问题没解决,就是我想生成每个类(接 ...