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. 浅析贝叶斯神经网络（Based on Variational Bayesian）

    https://blog.csdn.net/qq_20195745/article/details/82453589 贝叶斯神经网络简介 对于一个神经网络来说,最为核心的是如何根据训练集的数据,得到各 ...

  2. 【MySQL】InnoDB 内存管理机制 --- Buffer Pool

    InnoDB Buffer Pool 是一块连续的内存,用来存储访问过的数据页面 innodb_buffer_pool_size 参数用来定义 innodb 的 buffer pool 的大小 是 M ...

  3. 问题：Linux报swap空间占用过高，但物理内存还有空余

    报错 收到报警,swap空间占用过高,登录到系统查看内存使用详情,看到物理内存还有很多未使用 问题分析 Swap配置对性能的影响分配太多的Swap空间会浪费磁盘空间,而Swap空间太少,则系统会发生错 ...

  4. linux准备工具VMware以及ubuntu

    链接:https://pan.baidu.com/s/1j7DZCmzOcC2rPAciHtZgkA 密码:et5s

  5. vue3.0使用axios报错问题记录

    vue-cli3.0使用axios的时候出现错误,记录一下 报错信息: Uncaught TypeError: Cannot set property $axios of #<Vue> w ...

  6. 【做题】SRM704 Div1 Median - ModEquation——数论

    原文链接 https://www.cnblogs.com/cly-none/p/SRM704Div1B.html 给出\(n\)和模数\(P\).\(q\)次询问,每次给出一个\([0,P-1]\)范 ...

  7. Page.Cache

    https://docs.microsoft.com/en-us/dotnet/api/system.web.ui.page.cache?view=netframework-4.8 Gets the ...

  8. python程序—士兵出击

    class Gun: def __init__(self,gun_type): self.gun_type=gun_type self.bullet_count= def add_bullet(sel ...

  9. [php] 添加接口访问日志(文件)

    日志参数: 请求参数,请求地址,响应结果 步骤: 1. 定义日志目录,没有的需要创建 2. 定义日志名称 3. 以追加的形式写入日志文件  FILE_APPEND public function ad ...

  10. Jmeter转换成中文模式

    本片文章转至:https://blog.csdn.net/him2014/article/details/79603887 下载安装好Jmeter后默认的是英文,对于我这种学渣来说简直就是受到了100 ...