HTML:

<!DOCTYPE html>
<html> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>RGB颜色转换</title>
<script language="javascript"> function showRGB(obj) {
// 其中red、green、blue都是输入框对应的name值
var oRed = obj.red.value;
var oGreen = obj.green.value
var oBlue = obj.blue.value;
//将RGB转换为16进制Hex值,字符串
oHexcode = "#" + toHex(oRed) + toHex(oGreen) + toHex(oBlue);
var oDiv = document.getElementById("div");
// div的背景色=name为hexval输入框的值=16进制背景色的值
oDiv.style.background = obj.hexval.value = oHexcode;
} function toHex(d) {
// 如果输入的不是数字
if (isNaN(d)) {
d = 0;
}
// 16进制转换方法
var n = new Number(d).toString(16);
return (n.length == 1 ? "0" + n : n);
}
</script> </head> <body>
<form style="border: 1px blue solid;">
<b>请输入RGB颜色值(0 to 255)</b><br>
Red: <input type="text" name="red" size="5"><br>
Green: <input type="text" name="green" size="5"><br>
Blue: <input type="text" name="blue" size="5"><br>
<button onClick="showRGB(this.parentNode)" type="button">显示Hex #</button>
Hex值为: <input type="text" name="hexval" size="7"> </form>
<div id="div" style="margin: 50px;width: 200px;height: 200px;border: 1px solid red;"></div> </body> </html>

result:

aaarticlea/png;base64,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" alt="" />

在线输入RGB更改背景色的更多相关文章

  1. DateGridView中添加下拉框列并实现数据绑定、更改背景色

    1.添加下拉框 代码实现==> using System; using System.Collections.Generic; using System.Windows.Forms; names ...

  2. GUI编程笔记(java)08:GUI通过鼠标移动到按钮上更改背景色案例

    首先我们看看源代码如下: package cn.itcast_06; import java.awt.Button; import java.awt.Color; import java.awt.Fl ...

  3. UWP的TextBox和PasswordBox使用输入范围更改触摸键盘InputScope

    原文:UWP的TextBox和PasswordBox使用输入范围更改触摸键盘InputScope 当你的应用运行在具有触摸屏的设备上时,触摸键盘可用于文本输入.当用户点击可编辑的输入字段(如 Text ...

  4. wpf ListView DataTemplate方式的鼠标悬停和选中更改背景色

    今天使用wpf技术弄一个ListView的时候,由于需求需要,需要ListView显示不同的数据模板,很自然的使用了DataTemplate方式来定义多个数据模板,并在ListView中使用ItemT ...

  5. IOS中如果使用RGB实现背景色

    在开发的过程中.我们往往会碰到图片很多的情况.这时候我们的程序打包就会变得很大.一些纯色的图片可以用RGB来实现.这样可以减少内存的占用MAC本中有数码测色计这个功能.通过这个我们可以获得图片的RGB ...

  6. element UI table show-overflow-tooltip属性更改背景色和字体颜色

    .el-tooltip__popper { width: 80%;/*修改宽度*/ background: #000 !important;/*背景色  !important优先级*/ opacity ...

  7. CSS+JQuery实现Tabs效果,点击更改背景色(不含图片)

    1,Html代码 <body> <div id="box"> <ul id="tab_nav"> <li class= ...

  8. 2015-11-04 报表(c#部分)(Datatable 查询,弹出日期控件,输入是否整数)

    using System;using System.Collections;using System.Configuration;using System.Data;using System.Linq ...

  9. web页面背景色控制

    有一道题要实现输入rgb数值,实现更换页面背景色的功能,如下图所示: 答案: <html> <head> <script type="text/javascri ...

随机推荐

  1. 【Leetcode】413. Arithmetic Slices

    Description A sequence of number is called arithmetic if it consists of at least three elements and ...

  2. SKIP(插入空行)

    WRITE 'This is the 1st line'. SKIP. WRITE 'This is the 2nd line'. 跳转至某一行 SKIP TO LINE line_number. 插 ...

  3. struts2学习笔记一

    一.框架概述 1.框架的意义与作用: 所谓框架,就是把一些繁琐的重复性代码封装起来,使程序员在编码中把更多的经历放到业务需求的分析和理解上面. 特点:封装了很多细节,程序员在使用的时候会非常简单. 2 ...

  4. python2.7练习小例子(二十六)

        26):题目:给一个不多于5位的正整数,要求:一.求它是几位数,二.逆序打印出各位数字.     程序分析:学会分解出每一位数.     程序源代码: #!/usr/bin/python # ...

  5. java二分法来求一个数组中一个值的key

    package TestArray; import java.util.Arrays; /** * 二分法查找 */ public class Test { public static void ma ...

  6. Python学习笔记(二)一一一字典总结

    创建方式:1 直接创建     newDictonary={‘key’:'value',} 2 列表转字典(dict函数) 3 基本操作:len 返回总数 dictionary[k]  返回k对应的值 ...

  7. Java 集合学习--集合概述

    一.集合框架 集合,通常也叫容器,java中有多种方式保存对象,集合是java保存对象(对象的引用)的方式之一,之前学习的数组是保存对象的最有效的方式,但是数组却存在一个缺陷,数组的大小是固定的,但是 ...

  8. tp5 常见问题 模板文件 路由

    W:视图 Q:是MVC中的V,也就是在模块下面的view目录下的html文件,就是写的页面. W:模板 Q:视图在控制器的叫法,在fetch,display等方法中传入的模板参数   最后传到视图. ...

  9. 权值树状数组 HDU-2852 KiKi's K-Number

    引入 权值树状数组就是数组下标是数值的数组,数组存储下标对应的值有几个数 题目 HDU-2852 KiKi's K-Number 题意 几种操作,p=0代表push:将数值为a的数压入盒子 p=1代表 ...

  10. Annoy解析

    Annoy是高维空间求近似最近邻的一个开源库. Annoy构建一棵二叉树,查询时间为O(logn). Annoy通过随机挑选两个点,并使用垂直于这个点的等距离超平面将集合划分为两部分. 如图所示,图中 ...