我在做页面的时候遇到过这种情况,在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. Python3的tcp socket接收不定长数据包接收到的数据不全。

    Python Socket API参考出处:http://blog.csdn.net/xiangpingli/article/details/47706707 使用socket.recv(pack_l ...

  2. Ubuntu 14.04 安装R 环境

    Introduction R is a popular open source programming language that specializes in statistical computi ...

  3. PHP简单的图片上传

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Extjs 下拉框

    刚刚熟练了easyui控件的使用,又開始了如今的这个项目. 这个项目是个半成品.前端使用的是Extjs控件,jsp中没有代码.就引用了非常多的js...于是乎有种不知所措了呀. . . 说实话特别的不 ...

  5. 如果返回结构体类型变量(named return value optimisation,NRVO)

    貌似这是一个非常愚蠢的问题,因为对于具有良好素质的程序员而言,在C中函数返回类型为结构体类型是不是有点不合格,干嘛不用指针做传入传出呢? 测试环境:Linux IOS 3.2.0-45-generic ...

  6. MathType公式波浪线怎么编辑

    数学公式中有很多符号与数学样式,在用手写时是没有问题的,但是很多论文或者期刊中也是需要用到这些符号或者样式的,比如公式波浪线,那么MathType公式波浪线怎么编辑出来呢? 具体操作步骤如下: 1.打 ...

  7. [转] CSocket 和CAsyncSocket类介绍

    微软的MFC把复杂的WinSock API函数封装到类里,这使得编写网络应用程序更容易. CAsyncSocket类逐个封装了WinSock API,为高级网络程序员提供了更加有力而灵活的方法.这个类 ...

  8. swift学习笔记之--类的计算属性

    1,Swift中类可以使用计算属性,即使用get和set来间接获取/改变其他属性的值,代码如下 class Calcuator{ ; ; var sum:Int{ get{ return a + b ...

  9. linux系统socket通信编程2

    一.概述 TCP(传输控制协议)和UDP(用户数据报协议是网络体系结构TCP/IP模型中传输层一层中的两个不同的通信协议. TCP:传输控制协议,一种面向连接的协议,给用户进程提供可靠的全双工的字节流 ...

  10. Path类和File类的应用

    今天是我学习C#基础的第13天,可以说马上就要结束这个基础课程,感觉学习的理论性的我不能说全部掌握了,我只想说在思路上面的语法以及用法我应该基本掌握了,感觉效果不错,不得不说,要想在一种语言上面有大的 ...