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. 湖南省队集训 Day 2

    从这里开始 Problem A 走路 Problem B 游戏 Problem C 有趣的字符串题 暴力分又没骗满sad..... Problem A 走路 $O(n^2)$动态规划是显然的. 更新方 ...

  2. java的lamda表达式

    Java8才支持lamda表达式  lamda是一中函数式编程语言 通过实现模式是匿名内部类 java使用内部类实现接口 首先定义一个接口 @FunctionalInterfaceinterface ...

  3. 搭建Flutter-iOS开发环境

    https://www.jianshu.com/p/b50a92afbef1 1.获取Flutter工程 git clone -b beta https://github.com/flutter/fl ...

  4. 关于html中的 script标签中的 代码写法有效性? easyui tabs的href不能载入内容页面

    script标签, 即 html中的 js脚本区域中: 它其实就是一个 普通的 html标签, 在 html 渲染器 parser 看来, 它跟其他任何的普通 的 html标签 , 比如 p 标签, ...

  5. HDU 3565 Bi-peak Number（数位DP）题解

    题意:我们定义每一位先严格递增(第一位不为0)后严格递减的数为峰(比如1231),一个数由两个峰组成称为双峰,一个双峰的价值为每一位位数和,问L~R双峰最大价值 思路:数位DP.显然这个问题和pos有 ...

  6. Bytom储蓄分红合约解析

    储蓄分红合约简介 储蓄分红合约指的是项目方发起了一个锁仓计划(即储蓄合约和取现合约),用户可以在准备期自由选择锁仓金额参与该计划,等到锁仓到期之后还可以自动获取锁仓的利润.用户可以在准备期内(dueB ...

  7. TYVJ P1039 【忠诚2】

    题目描述 老管家是一个聪明能干的人.他为财主工作了整整10年,财主为了让自已账目更加清楚.要求管家每天记k次账,由于管家聪明能干,因而管家总是让财主十分满意.但是由于一些人的挑拨,财主还是对管家产生了 ...

  8. Java基础知识盘点（二）- 集合篇

    List和Set区别 List和Set都是继承Collection接口 List特点:元素有放入顺序,元素可重复 Set特点:元素无放入顺序,元素不可重复 Set和List对比: Set:检索元素效率 ...

  9. Jenkins 配置邮件通知步骤

    Jenkins 配置邮件通知前言 可以在Jenkins 中配置邮件通知,比如在构建失败时发送邮件通知项目组来及时修复问题. Jenkins 邮件通知功能的插件主要包括: Mailer Plugin ( ...

  10. redis缓存中间件基础

    前序: 默认使用SimpleCacheConfiguration 组件ConcurrentMapCacheManager==ConcurrentMapCache将数据保存在ConcurrentMap& ...