主要是要区别不同浏览器的不同css类

在input框中有时想将输入的字和placeholder设为不同的颜色或其它效果,这时就可以用以下代码来对placeholder进行样式设置了。

input::-webkit-input-placeholder{}    /* 使用webkit内核的浏览器 */
input:-moz-placeholder{}                  /* Firefox版本4-18 */
input::-moz-placeholder{}                  /* Firefox版本19+ */
input:-ms-input-placeholder{}           /* IE浏览器 */
注1:冒号前写对应的input或textarea元素等。
注2:placeholder属性是css3中新增加的属性,IE9和Opera12以下版本的CSS选择器均不支持占位文本。
如:
input::-webkit-input-placeholder {
color: red;
font-size: 25px;
}

更改input标签的placeholder的样式的更多相关文章

  1. 设置input标签的placeholder的样式

    设置input样式代码: input::-webkit-input-placeholder{ /*WebKit browsers*/ color: red; } input::-moz-input-p ...

  2. 关于input标签和placeholder在IE8,9下的兼容问题

    一. input常用在表单的输入,包括text,password,H5后又新增了许多type属性值,如url, email, member等等,考虑到非现代浏览器的兼容性问题,这些新的type常用在移 ...

  3. 更改input【type=file】样式

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. js更改input标签的读写属性

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 改变input标签中placeholder显示的颜色

    ::-webkit-input-placeholder { /* WebKit browsers */ color: #A9A9A9; } :-moz-placeholder { /* Mozilla ...

  6. css3更改input单选和多选的样式

    在项目开发中我们经常会遇到需要更改input单选和多选样式的情况,今天就给大家介绍一种简单改变input单选和多选样式的办法. 在这之前先简单介绍一下:before伪类 :before 选择器向选定的 ...

  7. input框中修改placeholder的样式

    有时间input标签的placeholder属性会出现问题,下面是修改placeholder的样式demo input::-webkit-input-placeholder{ color:red; f ...

  8. 前端 html input标签 placeholder属性 标签上显示内容

    前端 html  input标签 的placeholder属性  标签上显示内容 <!DOCTYPE html> <html lang="en"> < ...

  9. 关于 html input标签的几个常用操作

    1.清除 input 标签默认样式 input { -moz-appearance: none; outline: 0; text-decoration: none; outline: none; b ...

随机推荐

  1. Android应用程序版本升级时签名冲突

    这种错误特别容易在调试中出现,原因是你手机上的应用是直接用eclipse或者android studio安装的,而eclipse或者android studio有自己默认的签名:**debug.key ...

  2. API 接口开发规范

    整体规范建议采用RESTful 方式来实施. 协议 API与用户的通信协议,总是使用HTTPs协议,确保交互数据的传输安全. 域名 应该尽量将API部署在专用域名之下.https://api.exam ...

  3. beanFactory 设计模式 Bean 生命周期的胡言乱语,哈哈

    写在前面的话 适用读者:有一定经验的,本文不适合初学者,因为可能不能理解我在说什么 文章思路:不会一开始就像别的博客文章那样,Bean 的生命周期,源码解读(给你贴一大堆的源码).个人觉得应该由问题驱 ...

  4. Java创建线程的四种方式

    Java创建线程的四种方式 1.继承Thread类创建线程 定义Thread类的子类,并重写该类的run方法,run()方法的内容就是该线程执行的内容 创建Thread子类的实例,即创建了线程对象. ...

  5. 使用memset初始化int数组

    memset()是一个来自于string库的函数,正规用法是初始化char类型的数组.因为char类型只占1个字节,memset按字节赋值后,会将char类型数组的所有元素变为你指定的值.但是4字节的 ...

  6. UVA12433 【Rent a Car】

    这题应该算是比较难的一道网络流的题,(但却在我校OJ考试上出现了),但是大家只要能理解此图的建边方式就行. 假设有5天的租车需求,虚拟出2*n+2 即 12个节点,0为源点,12为汇点. 1,源点到1 ...

  7. Android 开源库 GitHub 托管

    本文微信公众号「AndroidTraveler」首发. 背景 之前给大家写过一篇文章 Android 上传开源项目到 jcenter 实战踩坑之路,分享了上传开源项目到 jcenter 上面的一些踩坑 ...

  8. 程序员学点xx 之 Redis

    程序员学点xx 之 Redis 概述 其实程序员也要和操作系统打交道, 比如最常见的,部署自己电脑上的开发环境. 当然有时某些牛人, 觉得运维或基础部门的同事不够给力, 亲自上手部署服务器或线上环境, ...

  9. ElasticSearch(六):索引模板

    ElasticSearch(六):索引模板 学习课程链接<Elasticsearch核心技术与实战> Index Template Index Template - 帮助你设定Mappin ...

  10. C#/.Net开发入门篇(1)——开发工具安装

    众所周知,工欲善其事必先利其器,要想砍柴快一定得有把好刀,那么要想代码写的有效率.质量高一个趁手的编辑器是必不可少的,写代码不可能就用系统自带的文本编辑器(如果是大佬当我没说),这里我推荐各位使用微软 ...