我在做页面的时候遇到过这种情况,在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. 谷哥的小弟学后台(04)——MySQL(4)

    探索Android软键盘的疑难杂症 深入探讨Android异步精髓Handler 具体解释Android主流框架不可或缺的基石 站在源代码的肩膀上全解Scroller工作机制 Android多分辨率适 ...

  2. poj2513(无向图判欧拉路)

    链接:id=2513">点击打开链接 题意:一堆木棍左右两端涂有颜色,同样颜色的能够连接在一起,问全部木棍是否能都连上 代码: #include <map> #includ ...

  3. linux centos 系统怎么设置中文模式

    首先,需要安装一下linux桌面程序.一般系统有自带的桌面,然后我们打开系统,进入系统登录界面 2 我们先输入我们的帐号然后回车,之后接着输入密码,你会发现最下面边框有让你选择语言的选项 3 我们点击 ...

  4. 快速找出System.Management.Automation.dll,c#调用powershell

    public static void InvokeSystemPS(string cmd) { List<string> ps = new List<string>(); ps ...

  5. oracle的loop等循环语句的几个用法小例子[转]

    --loop循环用法 (输出1到10) declare v_num number(2) := 0; begin loop v_num := v_num + 1; exit when v_num > ...

  6. js使用正则表达式从url中获取参数值

    //从url中获取参数值 function getvl(name) { var reg = new RegExp("(^|\\?|&)"+ name +"=([^ ...

  7. hadoop学习笔记之-hbase完全分布模式安装-5

    http://blog.csdn.net/lichangzai/article/details/8441975 http://blog.csdn.net/jpiverson/article/detai ...

  8. VS2013+opencv2.4.9配置

    VS2013+opencv2.4.9(10)配置[zz] - yifeier12 - 博客园 http://www.cnblogs.com/cuteshongshong/p/4057193.html ...

  9. JavaScript匿名函数和回调函数

    匿名函数的自调函数格式: (function(){ //代码 })(); <script type="text/javascript"> (function(){ al ...

  10. UI设计要学哪些软件

    准备做UI设计的或是已经在做UI设计的童鞋,哪些软件是我们要学习的重点,作者把UI设计分成了好几个不同的职业方向,从事什么UI设计方向,就学什么软件,这样针对性就很强了,无论怎么说,Photoshop ...