1、CSS选择器

因为每个浏览器的CSS选择器有所差异,所以需要针对每个浏览器做单独的设定。

::-webkit-input-placeholder { /* WebKit browsers */ 
color: #999; 

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
color: #999; 

::-moz-placeholder { /* Mozilla Firefox 19+ */ 
color: #999; 

:-ms-input-placeholder { /* Internet Explorer 10+ */ 
color: #999; 
}

2、textarea风格样式的代码,如下:

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { 
color: #636363; 

input:-moz-placeholder, textarea:-moz-placeholder { 
color: #636363; 
}

3、指定修改哪个input的placehoder属性,可以使用class

input.addCardInput::-webkit-input-placeholder{
color: #ccc;
}
input.addCardInput:-moz-placeholder{
color: #ccc;
}
input.addCardInput::-moz-placeholder{
color: #ccc;
}
input.addCardInput:-ms-input-placeholder{
color: #ccc;
}

4、在Firefox和IE里,正常input文本颜色覆盖占位符颜色的方法:

::-webkit-input-placeholder { 
color: red; text-overflow: ellipsis; 

:-moz-placeholder { 
color: #acacac !important; text-overflow: ellipsis; 

::-moz-placeholder { 
color: #acacac !important; text-overflow: ellipsis; 
} /* for the future */ 
:-ms-input-placeholder { 
color: #acacac !important; text-overflow: ellipsis; 
}

修改input的placeholder颜色的更多相关文章

  1. 修改input属性placeholder的样式

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

  2. 修改 input / textarea placeholder 属性的颜色和字体大小

    话不多说,直接上代码: input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #666; fon ...

  3. 修改Input中Placeholder默认提示颜色(兼容)

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #f00; } input:-moz-pl ...

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

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

  5. 修改input标签placeholder文字颜色

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { /* WebKit browsers */ color: ...

  6. input的placeholder颜色修改

    input[type=text]::-webkit-input-placeholder { /* WebKit browsers / color: #999; } input[type=text]:- ...

  7. h5 中修改input中 placeholder的颜色

    input::-webkit-input-placeholder{ color:blue; } input::-moz-placeholder{ /* Mozilla Firefox 19+ */ c ...

  8. 改变input的placeholder颜色

    input::-webkit-input-placeholder{ color:#666; } input::-ms-input-placeholder{ color:#666; } input::- ...

  9. 修改input 的 placeholder

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #666!important; } inp ...

随机推荐

  1. Nginx 之 内存池

    1.基本结构 先来学习一下nginx内存池的几个主要数据结构:[见:./src/core/ngx_palloc.h/.c]     ngx_pool_data_t(内存池数据块结构) 1: typed ...

  2. Python垃圾回收机制详解转自--Kevin Lu

    一.垃圾回收机制 Python中的垃圾回收是以引用计数为主,分代收集为辅.引用计数的缺陷是循环引用的问题. 在Python中,如果一个对象的引用数为0,Python虚拟机就会回收这个对象的内存. #e ...

  3. (2.4)Mysql之SQL基础——下载与使用测试库

    (2.4)SQL基础——下载与使用测试库 1.查看与下载测试数据库 2.查看安装向导视图 3.安装 [1]安装:解压后用 mysql 命令安装(记得加上set autocommit=1) [2]核验: ...

  4. IIS 搭建过程

      Windows自带iis管理器,也就是这个 <ignore_js_op> 我们可以用它来搭建一个网站,然后在局域网内可随意访问我们的电脑.   1.首先,iis的安装.        ...

  5. 注册表REG文件编写大全

    Windows 中的注册表文件( system.dat 和 user.dat )是 Windows 的核心数据库,因此,对 Windows 来说是非常重要的. 通过修改注册表文件中的数据,可以达到优化 ...

  6. lamp环境的搭建和安装

    最近,部门有些系统需要迁移到新的机器上,因此需要在新的机器上安装lamp和lnmp的环境,因此在这里总结一下: 一. 安装lamp环境的步骤:  (1).因为是新的机器,因此需要安装gcc的各种环境: ...

  7. 4-es6的模块化编程

    诞生背景其他都是第三方库,只有es才是官方正宗的,如果es早就制定的话,也不至于现在的这么百花齐放(混乱)的局面了 核心规范一个文件就是一个模块export是暴露出模块的公开方法import是导入 实 ...

  8. 跨域问题-cors

    什么是跨域如大家所知,出于安全考虑,浏览器会限制脚本中发起的跨站请求.比如,使用 XMLHttpRequest 对象发起 HTTP 请求就必须遵守同源策略(same-origin policy). 具 ...

  9. Redis学习笔记之Redis中5种数据结构的使用场景介绍

    原来看过 redisbook 这本书,对 redis 的基本功能都已经熟悉了,从上周开始看 redis 的源码.目前目标是吃透 redis 的数据结构.我们都知道,在 redis 中一共有5种数据结构 ...

  10. MySQL-5.7 备份与恢复

    一.备份分类 按介质分类: 物理备份 指通过拷贝数据库文件方式完成备份,适用于数据库很大,数据重要且需要快速恢复的数据库. 逻辑备份 指通过备份数据库的逻辑结构和数据内容的方式完成备份,适用于数据库不 ...