HTML:

<input type="text" placeholder="sample text"/>

CSS:

input::-webkit-input-placeholder {
color: #999;
}
input:focus::-webkit-input-placeholder {
color: red;
}
/* Firefox < 19 */
input:-moz-placeholder {
color: #999;
}
input:focus:-moz-placeholder {
color: red;
}
/* Firefox > 19 */
input::-moz-placeholder {
color: #999;
}
input:focus::-moz-placeholder {
color: red;
} /* Internet Explorer 10 */
input:-ms-input-placeholder {
color: #999;
}
input:focus:-ms-input-placeholder {
color: red;
}

input获得焦点时改变placeholder文本的样式的更多相关文章

  1. C#TreeView节点选中后失去焦点时改变节点背景色

    C#TreeView节点选中后失去焦点时改变节点背景色 在使用TreeView控件时候,单击一个节点,当鼠标聚焦到别的地方的时候,之前点击的这个节点就看不清楚了 举例截图 单击后           ...

  2. 去掉chrome浏览器中input获得焦点时的带颜色边框呢

    可以设置表单控件的outline属性为none值, 来去掉Chrome浏览器中输入框以及其它表单控件获得焦点时的带颜色边框. css代码如下: input{outline:none}

  3. input获得焦点时,如何让外边框不变蓝

    border 可应用于几乎所有有形的html元素,而outline 是针对链接.表单控件和ImageMap等元素设计. outline的效果将随元素的 focus 而自动出现,相应的随 blur 而自 ...

  4. Winform禁止容器内控件获得焦点时改变容器显示范围坐标

    在Winform中当容器的可视高度无法显示所有控件并且容器的AutoScroll属性设置为True的情况下,但点击容器内某个未显示完整的控件时,会出现容器的滚动条自动下滚的情况. 这是由于控件获得焦点 ...

  5. 【小程序】---- input获得焦点时placeholder重影BUG

    问题小程序的input组件有个自身的bug,即当输入框获取焦点时placeholder内容会出现重影现象. 解决思路原理:将placeholder内容单独写在另外的标签里,控制其显示隐藏.操作:将代表 ...

  6. webapp之登录页面当input获得焦点时,顶部版权文本被顶上去 的解决方法

    如上图,顶部版权是用绝对定位写的,被顶上去了,解决方法是判断屏幕大小,改变footer的定位方式: <script> var oHeight = $(document).height(); ...

  7. CSS设置input placeholder文本的样式

    placeholder是HTML5  input的新属性,英文意思是占位符,它一般表示input输入框的默认提示值. 下面是设置placeholder的文本样式的选择器的示例: /* webkit 浏 ...

  8. :input获得焦点时被弹出键盘挡住解决办法

    这个是移动端非常常见的bug了,这里说下综合的解决办法,因为有时候你的办法就是会失效.. 上代码 /*input框调起输入法盖住输入问题*/$('input[type="text" ...

  9. 当网页失去焦点时改变网页的title值

    <script> document.addEventListener('visibilitychange', function() { var isHidden = document.hi ...

随机推荐

  1. Thrift辅助类,用于简化Thrift编程

    CThriftServerHelper用于服务端,CThriftClientHelper用于客户端. IDL定义: service PackageManagerService { } 服务端使用示例: ...

  2. Eclipse快捷键和练习题(倒叙,排序)

    1    快捷键 内容辅助键  Alt+/ 自动补齐main方法  main 然后 Alt+/ 自动补齐输出语句  syso 然后 Alt+/ 格式化Ctrl+Shift+f 代码区域右键 -- So ...

  3. jmeter监控内存,CPU等方法

    方法1: 使用插件来监控CPU,内存等的使用情况 1.需要的插件准备 JMeterPlugins-Standard-1.4.0.zip , JMeterPlugins-Extras-1.4.0.zip ...

  4. ThinkJS 中的Logic层

    第一个为什么需要Logic层: 当在 Action 里处理用户的请求时,经常要先获取用户提交过来的数据,然后对其校验,如果校验没问题后才能进行后续的操作:当参数校验完成后,有时候还要进行权限判断等,这 ...

  5. Middleware / 中间件

    中间件格式 module.exports = options => { return (ctx, next) => { // do something } } 中间件格式为一个高阶函数,外 ...

  6. IOS 6 自动布局 入门

    http://blog.csdn.net/itianyi/article/details/8535392

  7. django使用ajax传输数据

    HTML文件ajax get例子 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  8. $.ajax()所有参数详解

    原文:https://www.cnblogs.com/everest33Tong/p/6159700.html [一]$.ajax()所有参数详解 url: 要求为String类型的参数,(默认为当前 ...

  9. Dev 之 GridControl 列表 显示底部(包括底部统计)

    1.列表 Gridview 显示底部 2 底部增加统计

  10. 基于flask的轻量级webapi开发入门-从搭建到部署

    基于flask的轻量级webapi开发入门-从搭建到部署 注:本文的代码开发工作均是在python3.7环境下完成的. 关键词:python flask tornado webapi 在python虚 ...