我在做页面的时候遇到过这种情况，在input标签中有默认字，但是设计稿上的颜色和input标签中的placeholder的默认颜色不一致。虽然我们可以在js中写出，但是有点过于麻烦了。

所以我就用css来给它设置了一下（注意css中有可能存在兼容性问题，如果实在不行还得用js。不过一般要求不严可以用这个偷偷懒）。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title></title>

        <style>

             #txt{

    　　　　　　　height:100%;

　　　　　　　　　 width:230px;

　　　　　　　　　 font-size:12px;color:red;

　　　　　　　 }

　　　　　　　　　#txt::-webkit-input-placeholder{

　　　　　　　　　　　color:red;

　　　　　　　　　}

        </style>

</head>

<body>

    <input type="text" id="txt" placeholder="请输入主题或关键词"/>

</body>

</html>

这样我们就可以用更少的时间做更多的事了。

如何用css给input的placeholder设置颜色的更多相关文章

  1. css改变input输入框placeholder值颜色

    ::-webkit-input-placeholder { /* WebKit browsers */ color: #fff; } :-moz-placeholder { /* Mozilla Fi ...

  2. 改变input的placeholder字体颜色

    改变input的placeholder字体颜色,注意哦,只是placeholder的字,用户输入的字不可以 input::-webkit-input-placeholder{ coloc:#000; ...

  3. input修改placeholder中颜色和字体大小

    input::-webkit-input-placeholder { /* placeholder颜色 */ color: #aab2bd; /* placeholder字体大小 */ font-si ...

  4. 设置input标签placeholder字体颜色

    有时会遇到这样的需求,输入框的默认提示文字与用户输入的文字不同. <input className="city" placeholder="城市"/> ...

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

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

  6. input的placeholder的颜色、字号、边距设置

    #scbar_txt::-webkit-input-placeholder { /* WebKit browsers */    text-indent: 10px; font-size:16px; ...

  7. input的placeholder文字颜色修改

    input::-webkit-input-placeholder { color: #D6D0CA !important; /* WebKit browsers / } input:-moz-plac ...

  8. input type=color 设置颜色

    在设置背景色的时候,使用html5 type=color 标签,但是初始值一直都是黑色的,背景如果没有设置的时候,应该是白色,比如文本图元,所以需要设置一个初始的颜色值, 注意: value不实用,怎 ...

  9. input修改placeholder文字颜色

    少废话,上代码: <style> input::-webkit-input-placeholder{ color:red; } input::-moz-placeholder{ /* Mo ...

随机推荐

  1. CSS格式化 CSS代码压缩工具

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 关于Cocos2d-x中类与类之间调用彼此方法的机制

    1.一般情况下都是把需要实例化的对象类的头文件包含到一个GameController.h中,再在GameController.cpp文件里面去使用各种对象类的方法来实现游戏的逻辑. 2.还有的时候会把 ...

  3. 【转】Spring 的下载、安装和使用

    一.下载 Spring 下载地址:http://repo.spring.io/libs-release-local/org/springframework/spring/4.0.6.RELEASE/  ...

  4. 用cxf生成webservice的java客户端代码

    百度来的: 最近,由于要用到某公司提供的webservice实现的api接口,想到了用cxf的wsdl2java工具来生成客户端程序.(自己写是比较麻烦且费时,so偷懒一下..) 使用步骤如下: 一. ...

  5. 关于HTTP keep-alive的实验（转至 http://my.oschina.net/flashsword/blog/80037）

    前面一篇文章提到,HTTP1.1中持久连接已经是默认配置,除非设置Connection为close,否则默认都会进行持久连接.但是我们知道事实标准跟教科书还是可能会有一定差距的,所以不妨自己尝试一下. ...

  6. 转载：MochiWeb一些资料的链接

    转自:http://veniceweb.googlecode.com/svn/trunk/public/daily_tech_doc/mochiweb_20091030.txt MochiWeb项目主 ...

  7. samtools faidx 命令处理fasta序列

    samtools faidx 能够对fasta 序列建立一个后缀为.fai 的文件,根据这个.fai 文件和原始的fastsa文件, 能够快速的提取任意区域的序列 用法: samtools faidx ...

  8. 【Java面试题】5 Integer的int 的种种比较？详细分析

    如果面试官问Integer与int的区别:估计大多数人只会说道两点,Ingeter是int的包装类,int的初值为0,Ingeter的初值为null.但是如果面试官再问一下Integer i = 1; ...

  9. eclipse安装spring tool suite插件

    在实际项目开发时,如果我们创建了一个spring文件,其实也就是个xml文件,如果没有集成spring的开发工具,创建的就是一个单纯的xml文件.安装spring插件以后创建spring配置文件会方便 ...

  10. c++ template<typename T>

    template <typename T> 网上查了半天不知所云,网上说的太多,俺只是要知道所需要的就可以了. 写了个程序试了一下,其实就是这个东西可以根据你所需要的类型就行匹配.其实就是 ...