input获得焦点时改变placeholder文本的样式
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文本的样式的更多相关文章
- C#TreeView节点选中后失去焦点时改变节点背景色
C#TreeView节点选中后失去焦点时改变节点背景色 在使用TreeView控件时候,单击一个节点,当鼠标聚焦到别的地方的时候,之前点击的这个节点就看不清楚了 举例截图 单击后 ...
- 去掉chrome浏览器中input获得焦点时的带颜色边框呢
可以设置表单控件的outline属性为none值, 来去掉Chrome浏览器中输入框以及其它表单控件获得焦点时的带颜色边框. css代码如下: input{outline:none}
- input获得焦点时,如何让外边框不变蓝
border 可应用于几乎所有有形的html元素,而outline 是针对链接.表单控件和ImageMap等元素设计. outline的效果将随元素的 focus 而自动出现,相应的随 blur 而自 ...
- Winform禁止容器内控件获得焦点时改变容器显示范围坐标
在Winform中当容器的可视高度无法显示所有控件并且容器的AutoScroll属性设置为True的情况下,但点击容器内某个未显示完整的控件时,会出现容器的滚动条自动下滚的情况. 这是由于控件获得焦点 ...
- 【小程序】---- input获得焦点时placeholder重影BUG
问题小程序的input组件有个自身的bug,即当输入框获取焦点时placeholder内容会出现重影现象. 解决思路原理:将placeholder内容单独写在另外的标签里,控制其显示隐藏.操作:将代表 ...
- webapp之登录页面当input获得焦点时,顶部版权文本被顶上去 的解决方法
如上图,顶部版权是用绝对定位写的,被顶上去了,解决方法是判断屏幕大小,改变footer的定位方式: <script> var oHeight = $(document).height(); ...
- CSS设置input placeholder文本的样式
placeholder是HTML5 input的新属性,英文意思是占位符,它一般表示input输入框的默认提示值. 下面是设置placeholder的文本样式的选择器的示例: /* webkit 浏 ...
- :input获得焦点时被弹出键盘挡住解决办法
这个是移动端非常常见的bug了,这里说下综合的解决办法,因为有时候你的办法就是会失效.. 上代码 /*input框调起输入法盖住输入问题*/$('input[type="text" ...
- 当网页失去焦点时改变网页的title值
<script> document.addEventListener('visibilitychange', function() { var isHidden = document.hi ...
随机推荐
- redis整理の主从复制
redis 主从复制配置和使用都非常简单.通过主从复制可以允许多个 slave server 拥有和 master server 相同的数据库副本. 特点: (1).master 可以拥有多个 sla ...
- log4net 入门使用
log4net 是dotnet平台下的一个日记记录组件. 一 NuGet中安装log4net包: 二 配置log4net.config文件 配置文件内容: <?xml version=&quo ...
- Android-ListView-CursorAdapter
在上篇博客,Android-ListView-SimpleCursorAdapter,中介绍了SimpleCurosrAdapter的使用操作(SimpleCursorAdapter是简单便捷Curs ...
- [Perl]Can't link/include C library 'ft2build.h', 'freetype', aborting.
原文:http://www.code-by.org/viewtopic.php?f=60&t=284 错误提示 Font-FreeType-0.07>perl Makefile.PL B ...
- 【redis基础】
基础知识 http://www.runoob.com/redis/redis-partitioning.html redis性能分析 https://www.cnblogs.com/mushroom/ ...
- 关于word转化成xml,图片的转换
当word另存为xml的时候,其中的图片会以Base64编码形式展示在xml文件的特定位置, java中操作图片转换成64位编码的方式: 可将返回的64直接放在前面的未知即可:
- php 的加法
无意间看到了php中关于加,减,乘,除 的计算方法 这里 http://lxr.php.net/source/xref/PHP-5.6/Zend/zend_operators.h#596 static ...
- P3267 [JLOI2016/SHOI2016]侦察守卫
$ \color{#0066ff}{ 题目描述 }$ 小R和B神正在玩一款游戏.这款游戏的地图由N个点和N-1条无向边组成,每条无向边连接两个点,且地图是连通的.换句话说,游戏的地图是一棵有N个节点的 ...
- js计算器案例
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>j ...
- Nodejs连接数据库为何使用连接池
问题一.nodejs既然是单线程运行,在连接数据库时为何要使用连接池呢? 问题二,redis服务端是单线程运行的,使用连接池到redis,服务端还是串行处理,有什么意义么? 这两个问题都涉及到单线程与 ...