<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="textml; charset=utf-8" />

<title>输入框点击时边框变色效果</title>

</head>

<body>

<style type="text/css">

.focusInput {border:1px solid #99CC33;}

</style>

<script type="text/javascript">

function focusInput(focusClass) {

    var elements = document.getElementsByTagName("input");

    for (var i=0; i < elements.length; i++) {

        if (elements[i].type != "button" && elements[i].type != "submit" && elements[i].type != "reset") {

            elements[i].onfocus = function() { this.className = focusClass; };

            elements[i].onblur = function() { this.className = ''; };

        }

    }

}

window.onload = function () {

    focusInput('focusInput');

}

</script>

请输入姓名：<input type="text" />

</body>

</html>

input框颜色修该的更多相关文章

  1. 四、Input框改placeholder中字体的颜色

    Input框改placeholder中字体的颜色 input::-webkit-input-placeholder { color: #ccc; font-size: 12px; }

  2. 苹果手机input框上方有一条阴影线以及input框的placeholder颜色的设置

    今天做手机端的时候,用到input框来输入手机号码,但是在安卓手机上input的效果是正常的,在苹果手机上,input的上边框会变粗,有阴影 因为苹果手机的默认给input加上了阴影 给input加入 ...

  3. CSS渐变字体、镂空字体、input框提示信息颜色、给图片加上内阴影、3/4圆

    1.渐变字体 主要是看:-webkit-background-clip: text; 该属性 <style> .b1{ width: 500px; height: 200px; font- ...

  4. input框自动填充内容背景颜色为黄色解决方法

    谷歌浏览器input自动填充内容,背景色会是黄色,想改的话: input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset;} 这种方 ...

  5. 解决input框中加入disabled="disabled"之后，改变字体的颜色（默认的是灰色）

    在input框中加入disabled="disabled"之后,字体默认的就变成灰色了 解决方案 input[disabled]{color:#fff;opacity:1} dis ...

  6. HTML5 input placeholder 颜色修改示例

    Chrome支持input=[type=text]占位文本属性,但下列CSS样式却不起作用: CSS 复制代码 代码如下: input[placeholder], [placeholder], *[p ...

  7. 使用CSS修改HTML5 input placeholder颜色

    HTML <input type="text" placeholder="Value" /> 有三种实现方式:伪元素(pseudo-elements ...

  8. 使用CSS修改HTML5 input placeholder颜色( 转载 )

    问题:Chrome支持input=[type=text]占位文本属性,但下列CSS样式却不起作用: input[placeholder], [placeholder], *[placeholder] ...

  9. HTML5 input placeholder 颜色 改动

    David Murdoch:Chrome支持input=[type=text]占位文本属性,但下列CSS样式却不起作用: CSS input[placeholder], [placeholder], ...

随机推荐

  1. [NOIP2011] 普及组

    数字反转 小模拟 #include<cstdio> #include<iostream> #include<cstring> using namespace std ...

  2. bzoj2054 疯狂的馒头

    bzoj上现在找不到这题,所以目前只是过了样例,没有测 2054: 疯狂的馒头 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 715  Solved: ...

  3. 锋利的jQuery-4--animate()的用法

    1.一般动画: $("btn").click(function(){ $("div").animate({"left" : "+= ...

  4. .NET中使用Memcached的相关资源整理

    Memcached官方站点:http://www.danga.com/memcached/ Memcached Win32 1.2.6下载:http://code.jellycan.com/memca ...

  5. [Winform]一个简单的账户管理工具

    最近一直觉得注册的账户越来越多,帐号密码神马的容易弄混.自己就折腾了一个简单的账户管理工具,其实实现也挺简单,将每个账户的密码及相关密码提示信息,经aes算法加密之后保存到数据库,当前登录用户可以查询 ...

  6. C++中析构函数的作用，

    如果构造函数打开了一个文件,最后不需要使用时文件就要被关闭.析构函数允许类自动完成类似清理工作,不必调用其他成员函数.析构函数也是特殊的类成员函数.简单来说,析构函数与构造函数的作用正好相反,它用来完 ...

  7. [转载]如何在Ubuntu上安装LAMP服务器系统

    [2013年7月25日 51CTO外电头条]为何应该在Ubuntu上安装LAMP服务器?从事Web开发工作时,我更偏爱在不受干扰的情况下,在我那台计算机上的开发环境下进行开发.我宁愿所犯的错误大部分是 ...

  8. Java主流日志工具库

    在项目开发中,为了跟踪代码的运行情况,常常要使用日志来记录信息.在Java世界,有很多的日志工具库来实现日志功能,避免了我们重复造轮子.我们先来逐一了解一下主流日志工具. 1.java.util.lo ...

  9. 微信JS-SDK

    <div class="lbox_close wxapi_form"> <h3 id="menu-basic">基础接口</h3& ...

  10. XML做下拉列表

    5-18X.php主页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http: ...