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. Flutter 数据存储 加权限 sharedpreference, sqflite, file

    要访问SD卡,首先读取权限肯定是要有的,不然写再多代码都是无用功.在AndroidManifest.xml文件中添加 <uses-permission android:name="an ...

  2. sshpass安装使用

    部署sshpass1.下载wget http://sourceforge.net/projects/sshpass/files/latest/download -O sshpass.tar.gz 2. ...

  3. CentOS 离线安装 MYSQL+APACHE+PHP

    一.MYSQL安装 下载MYSQL安装包:MySQL-client-XXX.rpm   MySQL-server-XXX.rpm   MySQL-devel-XXX.rpm 如有冲突,要先删除原来的M ...

  4. poj 1321 棋盘问题 （DFS深度优先搜索）

    Problem Description 在一个给定形状的棋盘(形状可能是不规则的)上面摆放棋子,棋子没有区别.要求摆放时任意的两个棋子不能放在棋盘中的同一行或者同一列,请编程求解对于给定形状和大小的棋 ...

  5. VC++ 实现程序重启

    转载:https://blog.csdn.net/what951006/article/details/72729448 一.创建一个Win32项目 二.窗口处理函数中,Create窗口时创建一个按钮 ...

  6. JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法

    网上搜索了,目前主流的Js代码压缩工具主要有Uglify.YUI Compressor.Google Closure Compiler,简单试用了UglifyJS 和Google Closure Co ...

  7. enum & json 之间的转换

    enum 转为 string:EnumMember & StringEnumConverter public enum CampaignStatus : Int32 { [EnumMember ...

  8. python2 与 python3的区别

    python2 与 python3的区别 几乎所有的python2程序都需要一些修改才能正常的运行在python3的环境下.为了简化这个转换过程,Python3自带了一个2to3的实用脚本.这个脚本会 ...

  9. springmvc定时任务

    1.SpringMVC.xml文件加这个 <task:annotation-driven scheduler="qbScheduler"/> <task:sche ...

  10. threejs深入纹理，立体场景cubeResolution（四）

    在这个课程里主要完成讲解两个demo: 一个是电视墙:用视频做纹理 一,用视频做纹理 首先我们用video标签把视频源引入: <video id="video" autopl ...