placeholder是HTML5  input的新属性,英文意思是占位符,它一般表示input输入框的默认提示值。

下面是设置placeholder的文本样式的选择器的示例:

/* webkit 浏览器*/
#field::-webkit-input-placeholder {
font-style:italic;
text-decoration:overline;
letter-spacing:3px;
color:#999;
}
/* 火狐浏览器 */
#field::-moz-placeholder {
font-style:italic;
text-decoration:overline;
letter-spacing:3px;
color:#999;
}

当然,和CSS设置::selection选中文本样式一样,你只能设置几个和文本有关系的CSS样式:Color, font-style, font-varian, background, text-decoration

PS:IE从IE 10才开始支持placeholder属性,伪选择器名字还不得而知,估计是加前缀-ms-了

CSS设置input placeholder文本的样式的更多相关文章

  1. css设置input获得焦点的样式

    input:focus{ 样式; } 这样就ok

  2. CSS:与input相关的一些样式设置问题

    input是HTML中非常重要,非常常用而又不可替代的元素,在于其相关的样式设置中有时会遇到其他元素不会发生的问题,今天把我印象中的一些小问题和解决方案记录一下. 1.与同行元素上下居中对齐 关于上下 ...

  3. css设置input中placeholder字体

    设置input中placeholder字体颜色 input::-webkit-input-placeholder {color:@a;} input:-moz-placeholder {color:@ ...

  4. CSS/Compass修改placeholder的文字样式

    在HTML5中,<input>与<textarea>标签支持placeholder属性,用来定义无任何输入时的默认文字. 可以通过CSS修改placeholder的文字样式: ...

  5. css 更改input radio checkbox的样式

    html <label> <input type="checkbox" class="colored-blue"> <span c ...

  6. input获得焦点时改变placeholder文本的样式

    HTML: <input type="text" placeholder="sample text"/> CSS: input::-webkit-i ...

  7. CSS设置input默认样式

    HTML <ul class="box"> <li> <input type="checkbox" name="vehi ...

  8. CSS - 修改input - placeholder 和 readonly 的样式

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

  9. 设置input placeholder的样式

    ::-webkit-input-placeholder {/*Chrome/Safari*/ font-family: 'Avenir', Helvetica, Arial, sans-serif; ...

随机推荐

  1. X11 基本绘图

    #include <X11/Xlib.h> int main() { Display * dsp = XOpenDisplay(NULL); int screenNum = Default ...

  2. WPF Image Binding Uri Source 失败解决办法

    在ListView 的ListItem里动态绑定Image. 首先代码写的是没有问题的.但最后运行却无法显示图片.先看代码: 1. XAML部分 代码如下: <ListView x:Name=& ...

  3. 使用Java注解开发自动生成SQL

    使用注解开发的好处就是减少配置文件的使用.在实际过程中,随着项目越来越复杂,功能越来越多,会产生非常多的配置文件.但是,当配置文件过多,实际维护过程中产生的问题就不容易定位,这样就会徒劳的增加工作量. ...

  4. bootstrap页面模板

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

  5. Myeclipse2014中,新建部署Maven项目

    一.环境 1.1 myeclipse2014 1.2 maven3.2.1 1.3 jdk1.7 上述环境配置可参照我之前编写的maven搭建方面的文档.本文着重介绍myeclipse2014下mav ...

  6. debian安装后sudo命令不能用的解决方法

    注:转载他人 且试用过了,我的debian版本是debian8.2 64X debian安装完之后发现sudo命令不能用 找了半天发现是没有安装sudo 得了,进入root安包,炸开他,apt-get ...

  7. 图片验证码自动识别,使用tess4j进行验证码自动识别(java实现)

    1.下载tess4j依赖的jar包,maven中央库地址:<dependency>            <groupId>net.sourceforge.tess4j< ...

  8. poi做Excel数据驱动,支持.xls和.xlsx格式的excel文档,比起jxl强大不少

    import java.io.FileInputStream;import java.io.InputStream;import java.util.Iterator;import java.util ...

  9. XPath相关笔记

    <?xml version="1.0" encoding="utf-8" ?> <employees>   <employee o ...

  10. npm 使用代理

    npm install 有时候会安装失败,可能是网络的问题,可以使用代理来安装 npm获取配置有6种方式,优先级由高到底. 命令行参数. --proxy http://server:port即将pro ...