我在做页面的时候遇到过这种情况,在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. Linux ad7606 驱动

    Linux中已经移植好了ad7606,位于driver/staging/iio/adc/目录中.只要在板级文件中添加device中即可. 移植参考文档: https://wiki.analog.com ...

  2. Struts2 ajax json使用介绍

    一.jar包首先引入Struts和json所需的jar包. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaXRteWhvbWUxOTkw/font/5a6 ...

  3. BIEE物理业务层编辑之后发布路径

    在BI 业务逻辑层编辑之后,需要发布,地址是http://pc201411260149:7001/em/, IP/em 在business intelligence 页面,点击部署,然后选择文件发布

  4. KAFKA安装+配置详解+常用操作+监控

    http://blog.csdn.net/hadas_wang/article/details/50056381 http://qiyishi.blog.51cto.com/5731577/18575 ...

  5. HTML&CSS精选笔记_HTML入门

    HTML入门 什么是HTML HTML基本文档格式 HTML文档的基本格式,其中主要包括<!DOCTYPE>文档类型声明.<html>根标记.<head>头部标记. ...

  6. 关于直播学习笔记-003-nginx-rtmp、srs、vlc、obs

    服务器 1.nginx-rtmp:https://github.com/illuspas/nginx-rtmp-win32 2.srs:https://github.com/illuspas/srs- ...

  7. 处理unsigned相减错误(BIGINT UNSIGNED value is out of range)

    mysql 当两个字段想减时,如果其中一个或两个字段的类型的unsigned无签名类型,如果想减的值小于0则会报错(BIGINT UNSIGNED value is out of range) 测试: ...

  8. 更改嵌入式Linux中开机画面----左上角小企鹅图标

    一直想给嵌入式仪表加个开机LOGO,但是没有找到更换的方法.最近在网上收集了一些文章,整理一下一共自己参考.目前也还没有试过这种方法究竟是否可以.但察看Kernel源代码可以知道,Linux-2.6的 ...

  9. CentOS6.4配置163的yum源

    CentOS系统自带的更新源的速度实在是慢,为了让CentOS6使用速度更快的YUM更新源,可以选择163(网易)的更新源. 1.下载repo文件 wget http://mirrors.163.co ...

  10. sql语句如何删除最后一条和第一条信息

    这是先前建好的SQL数据库中的test表, sql语句: delete a from test a,(select max(id) id from test) b where a.id = b.id ...