CSS设置input placeholder文本的样式

placeholder是HTML5 input的新属性,英文意思是占位符,它一般表示input输入框的默认提示值。

/* webkit 浏览器*/
#field1::-webkit-input-placeholder { color:#00f; }
#field2::-webkit-input-placeholder {
color:#090;
background:lightgreen;
text-transform:uppercase;
}
#field3::-webkit-input-placeholder {
font-style:italic;
text-decoration:overline;
letter-spacing:3px;
color:#999;
}
/* 火狐浏览器 */
#field1::-moz-placeholder { color:#00f; }
#field2::-moz-placeholder {
color:#090;
background:lightgreen;
text-transform:uppercase;
}
#field3::-moz-placeholder {
font-style:italic;
text-decoration:overline;
letter-spacing:3px;
color:#999;
}
当然,和CSS设置::selection选中文本样式一样,你只能设置几个和文本有关系的CSS样式:Color, font-style, font-varian, background, text-decoration
实例demo

PS:IE从IE 10才开始支持placeholder属性,伪选择器名字还不得而知,估计是加前缀-ms-了
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值