placeholder属性是css3中新增加的属性,

由于是新加入的属性因此对各大浏览器都不兼容:

因此在使用的时候要加兼容性

  火狐:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

  color:#999;

  }

 火狐 ::-moz-placeholder { /* Mozilla Firefox 19+ */

  color:#999;

  }

 ie浏览器 :-ms-input-placeholder { /* Internet Explorer 10+ */

  color:#999;

  }

谷歌 ::-webkit-input-placeholder { /* WebKit browsers */

  color:#999;

  }

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.test::-webkit-input-placeholder{
color: red;
} </style>
</head>
<body>
<input class="test" type="text" placeholder="测试" />
<br />
<input type="text" placeholder="测试" />
</body>
</html>

修改 input中的placeholder的字体样式和颜色的更多相关文章

  1. 修改input中的placeholder属性的颜色

    input::-webkit-input-placeholder{ color:#e8e8e8; } input::-moz-placeholder{ /* Mozilla Firefox 19+ * ...

  2. 改变input中的placeholder样式

    1.input[placeholder]{ color:#d5d5d5; } 2.input::-moz-placeholder { color: #d5d5d5; } input:-ms-input ...

  3. 修改Input中Placeholder默认提示颜色(兼容)

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #f00; } input:-moz-pl ...

  4. css 修改input中placeholder提示问题颜色

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: rgba(74, 87, 103, 1); ...

  5. h5 中修改input中 placeholder的颜色

    input::-webkit-input-placeholder{ color:blue; } input::-moz-placeholder{ /* Mozilla Firefox 19+ */ c ...

  6. 修改input file 文件上传的样式

    Web页面中,在需要上传文件时基本都会用到<input type="file">元素,它的默认样式: chrome下: IE下: 不管是上面哪种,样式都比较简单,和很多 ...

  7. 用in判断input中的placeholder属性是否在这个对象里

    <input id="test"> var ele = document.getElementById("test"); if("plac ...

  8. 移动端input中的placeholder属性垂直

    今天做项目时发现,在手机端用placeholder时,Android手机可以垂直显示:ISO则不能使placeholder垂直;解决办法: .gcddfadf-con-pay-1 input::-we ...

  9. 给 input 中 type="text" 设置CSS样式

    input[type="text"], input[type="password"] {    border: 1px solid #ccc;    paddi ...

随机推荐

  1. CSS3之calc()和box-sizing属性

    box-sizing 属性 规定两个并排的带边框的框: 例子: box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素. 例如,假如您需要并排放置两个带边框的框,可通过将 box-si ...

  2. vector内存回收

    1. vector所有的内存相关问题都可以归结于它的内存增长策略.vector有一个特点就是:内存空间只会增长不会减少.vector有两个函数,一个是capacity(),返回对象缓冲区(vector ...

  3. Linux 设置系统时间和时区1.Centos

  4. mysql配置外部允许外部连接

    1. 登录到mysql mysql -u root -p 2.进入到mysql 库中 use mysql 3.执行语句 update user set host=‘%’ where user=‘roo ...

  5. 从手机中导出apk

    输入指令adb devices, 出现类似下面信息,说明设备连接成功. List of devices attached HT4C3JT00386 device 3.查看该手机所有安装包的包名, 输入 ...

  6. HackerRank-Python攻城歷程-2.List comprehensions

    if __name__ == '__main__': x = int(input()) y = int(input()) z = int(input()) n = int(input()) print ...

  7. 7、Dockerfile详解

    参考: https://www.imooc.com/article/details/id/25229 https://www.cnblogs.com/panwenbin-logs/p/8007348. ...

  8. 记flask连接容联云时提示172001,网络错误

    直接用sms.py发送没有问题,直接从写好的注册页面发送就不行.在网上查了不少方法,试过了依然没用,结果换了一个网络就好了,估计是部分网络无法正常发送..后来问了下是环境问题,开发环境不稳定

  9. Django troubleshootings

    当在云服务器上部署Django服务时: 1. 首先要在云上的主机上添加相应的端口访问权限. 2. 在project下面的urls.py里面设置如下: ALLOWED_HOSTS = ['www.aby ...

  10. UVA - 11468 (AC自动机+动态规划)

    建立AC自动机,把AC自动机当做一张图,在上面跑L个节点就行了. 参考了刘汝佳的代码,发现可能有一个潜在的Bug--如果模式串中出现了没有指定的字符,AC自动机可能会建立出错. 提供一组关于这个BUG ...