我在做页面的时候遇到过这种情况，在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. Netstat命令（windows下）

    功能: 一般用于检验本机各端口的网络连接情况. 例子:检查本机3389远程连接端口是否可用 netstat -nao|find  "3389" 查看某进程使用的端口号: netst ...

  2. jQuery-编辑选择结果（添加、筛选、过滤或检测）

    编辑选择结果 操作  实例  效果  备注 添加 添加选择器 $("p").add(".a") 添加类名为a的选择器 并不影响源结果集     $(" ...

  3. 放在github pages上的静态网站怎么取消绑定自定义域名？

    使用GitHub Pages搭建的静态网站绑定了自定义域名操作,但是想反悔怎么办? 删除CNAME文件,重新删除仓库,新建后均不行~ 解决办法:清除一下浏览器缓存,或者用别的浏览器打开就好了,因为之前 ...

  4. boa.config

    # boa -c /usr/local/boa Port 80 #User 0#Group 0 ErrorLog /dev/console AccessLog /dev/console ServerN ...

  5. easyui-textbox 只读设置取消

    <script> $(function () { $("#txt_beginAmount").attr('readonly', true); $("#txt_ ...

  6. 工欲善其事 之 Web 前端调试工具格式化混淆过的 JS 代码

    工欲善其事 之 Web 前端调试工具格式化混淆过的 JS 代码 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致&q ...

  7. swift -- 计步器CMPedometer的使用

    最近公司接了个项目,是一款运动类型的APP,可以检测运动量(例如:步数,上下楼等).睡眠信息.速度等信息,因为以前粗略的了解过传感器方面的相关信息,知道主要是苹果设备内置的传感器在起作用,传感器的种类 ...

  8. remove()

    remove() 用于从列表中删除指定的元素 In [35]: l = ['a', 'b', 'c'] In [36]: l.remove('b') In [37]: l Out[37]: ['a', ...

  9. Python3 urllib 库

    urllib 简介 urllib 基础模块 使用 urllib 发送请求 使用 urllib 构造请求对象 关于 Handler 与 opener 使用 urllib 进行身份验证 使用 urllib ...

  10. exp/imp与expdp/impdp区别

    在平常备库和数据库迁移的时候,当遇到大的数据库的时候在用exp的时候往往是需要好几个小时,耗费大量时间.oracle10g以后可以用expdp来导出数据库花费的时间要远小于exp花费的时间,而且文件也 ...