修改 input / textarea placeholder 属性的颜色和字体大小
话不多说,直接上代码:
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #666;
font-size: 16px;
}
input::-moz-placeholder,
textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #666;
font-size: 16px;
}
input:-moz-placeholder,
textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #666;
font-size: 16px;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #666;
font-size: 16px;
}
注意:
1、WebKit, Blink, Edge 浏览器等需要带上 -webkit- 前缀,且是双冒号,写的时候还要带上input
2、针对火狐浏览器则有两种写法,一种是针对低版本的,一种是针对高版本的,二者都需要带上-moz-前缀。要点1:火狐低版本的使用冒号(:),而高版本的使用双冒号(::);要点2:火狐浏览器不需要像webkit内核那样要带上input。
3、由于 placeholder 属性只在IE10+才支持,因此,针对IE10、IE11的写法是加上-ms-前缀,使用的是冒号(:),需要带上input
特别强调:冒号与双冒号的问题,还有是否需要加上input
不用CSS得到同样效果的方法:
<input type="text" value="placeholder text" onfocus="this.style.color='#000';this.value='';" style="color: #f00;"/>
这个方法也不是很友好,当内容输入一半若点击到文本框外的地方,再重新输入的时候,前面输入的内容为空了 o'o 所以还是少用吧~~
修改 input / textarea placeholder 属性的颜色和字体大小的更多相关文章
- 修改Input中Placeholder默认提示颜色(兼容)
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #f00; } input:-moz-pl ...
- css 修改input中placeholder提示问题颜色
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: rgba(74, 87, 103, 1); ...
- 修改input的type属性
在ff和chrome中是可以直接修改input的type属性的,但是在ie下面是不允许的. 用jquery 的attr方法去修改,在jquery1.8.3版本会直接抛出异常,但在1.9及以上版本就不再 ...
- js修改input的type属性问题
js修改input的type属性有些限制.当input元素还未插入文档流之前,是可以修改它的值的,在ie和ff下都没问题.但如果input已经存在于页面,其type属性在ie下就成了只读属性了,不可以 ...
- JQuery中如何动态修改input的type属性
代码如下: jQuery(".member_id").focus(function() { jQuery(this).val(''); }).blur(function() { i ...
- ie8下修改input的type属性报错
摘要: 现在有一个需求如图所示,当用户勾选显示明文复选框时,要以明文显示用户输入的密码,去掉勾选时要变回密文,刚开始想到的就是修改输入框的type来决定显示明文还是密文,使用jQuery的attr来做 ...
- Hmtl5 <input>中placeholder属性(新属性)
Hmtl5 <input>中placeholder属性(新属性) 一.定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示 ...
- UILabletext去掉乱码 控制颜色 行高 自定义大小 。显示不同的字体颜色、字体大小、行间距、首行缩进、下划线等属性(NSMutableAttributedString)
text去掉乱码 设置不同颜色 行高 自定义大小 #import <Foundation/Foundation.h> @interface TextsForRow : NSObject @ ...
- 修改input的placeholder颜色
1.CSS选择器 因为每个浏览器的CSS选择器有所差异,所以需要针对每个浏览器做单独的设定. ::-webkit-input-placeholder { /* WebKit browsers */ c ...
随机推荐
- Remastersys打包你自己的ubuntu成iso文件
采用Remastersys3.0.4.ubuntu版本是ubuntu14.04 LTS amd64. (1)软件下载安装: 下载: 到http://www.easy-vdr.de/downloads/ ...
- IT题库8-死锁
一.死锁原理 死锁是指两个或两个以上的进程在执行过程中,由于竞争资源或者由于彼此通信而造成的一种阻塞的现象,若无外力作用,它们都将无法推进下去.此时称系统处于死锁状态或系统产生了死锁,这些永远在互相等 ...
- 文件下载后台报错IllegalStateException: getOutputStream() has already been called
java.lang.IllegalStateException: getOutputStream() has already been called <%@page language=" ...
- mika的模板库
二分图最大匹配: 1.匈牙利算法:注意dfs中是dfs(c[w[i]]),搜索的是与之匹配的点. #include<cstdio> #include<cstring> ],w[ ...
- php配置可被设定范围
PHP中的每个指令都有其所属的模式,这些模式决定这一个PHP指定在何时何地.是否能被设定.例如有些指令可以在 PHP 脚本中用 ini_set() 来设定,而有些则只能在php.ini 或 httpd ...
- js let
<script> var a; // 变量提升 js中的作用域只有在函数中 {} 才称为作用域 if/for循环都不是 都会产生变量提升 console.log(a); { a = 2; ...
- Qt文档阅读笔记-QGraphicsItem::paint中QStyleOptionGraphicsItem *option的进一步认识
官方解析 painter : 此参数用于绘图;option : 提供了item的风格,比如item的状态,曝光度以及详细的信息:widget : 想画到哪个widget上,如果要画在缓存区上,这个参数 ...
- MATLAB R2018b Mac中文版安装教程
MATLAB r2018b mac中文版是一款强大的可视化数学分析软件,专门用于在Mac上执行数值计算,编程和可视化任务时极大地提高您的工作效率.在MATLAB的帮助下,您可以分析数据,创建应用程序, ...
- Task: Indoor Positioning with WiFi Signals
Task: Indoor Positioning with WiFi SignalsYou are hired by a company to design an indoor localizatio ...
- 2018年-2019年第二学期第三周C#学习个人总结
在第三周,我们又开始了C#的进一步学习,学习的范围是从4.8static关键字到4.11对象初始化器.在4.8static关键字我学到了静态字段,静态属性,静态方法,静态类,静态构造方法单例模式,嵌套 ...