修改palceholder内文字的css样式

 ::-webkit-input-placeholder{
color: red;
font-size: 20px;
line-height: 50px;
}

修改class名为test1的元素palceholder内文字css样式

.test1::-webkit-input-placeholder{
color: red;
font-size: 20px;
line-height: 50px;
}

例子:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
input{
height: 50px;
font-size: 14px;
line-height: 50px;
} .test1::-webkit-input-placeholder{
color: red;
font-size: 20px;
line-height: 50px;
} </style>
</head>
<body>
<input class="test1" type="text" placeholder="测试" />
<input type="text" placeholder="测试" />
</body>
</html>

效果图:

至于兼容,加上相应浏览器的前缀

怎么修改placeholder字体的css样式的更多相关文章

  1. jQuery修改class属性和CSS样式

    jQuery修改class属性和CSS样式 class属性修改 类属性即class属性,规定类名. 用类选择器规定样式的时候,需要为元素指定类名,即class属性的值. 注意每个HTML元素只有一个c ...

  2. css 修改placeholder字体颜色字体大小 修改input记住账号密码后的默认背景色

     壹 ❀ 引 本来这个阶段的项目页面都是给实习生妹子做的,我只用写写功能接接数据,但这两天妹子要忙翻译,这个工作阶段也快结束了导致有点慌,只能自己把剩余的几个小页面给写了. 那么做页面的过程中,UI也 ...

  3. 修改html 属性,css样式。

    一 通过修改标签属性来改变它的样式  js设置和获取标签的属性 <script type="text/javascript"> window.onload = func ...

  4. 修改chrome浏览器默认css样式的方法

    最近重新用起了ubuntu kylin,然后又碰到之前让我感到有些难受的一个小问题:用chrome浏览部分网页时,一部分粗体字十分难看,就像是宋体直接加粗那样. 之前就觉得这样看起来很难受,但是找到的 ...

  5. CSS样式----CSS属性:字体属性和文本属性(图文详解)

    本文最初于2015-10-04发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重要内容 CSS的单位 字体属性 文本属性 定 ...

  6. CSS样式----图文详解(二):css属性

    主要内容 CSS的单位 字体属性 文本属性 背景属性 列表属性 盒子模型 定位属性:position.float.overflow.z-index等 导航栏的制作 鼠标的属性cursor 滤镜的介绍 ...

  7. css修改placeholder的样式

    css修改placeholder的样式 input::-webkit-input-placeholder { /* WebKit browsers */ font-size:14px; color: ...

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

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

  9. CSS如何修改placeholder样式

    项目用经常遇到修改input的placeholder的颜色的需求,这里来看一下placeholder如何用css设置: 原文发布与我的个人博客>> 首先来看一下chrome默认的input ...

随机推荐

  1. NFS(网络文件系统)

    http://baike.baidu.com/subview/44349/16134489.htm

  2. untiy绘制网格mesh

    关于绘制网格, 雨松前辈 已经解释的非常的到位,这里我只是搬运工,实在是感觉自己去描述的话不会有雨松大神描述的清楚,该文章循序渐进,一步步引导读者去理解unirty 绘图机制,真的是没有比这个再好得了 ...

  3. 删除作业计划出错(DELETE语句与 REFERENCE约束"FK_subplan_job_id"冲突。)

    删除作业计划出错(DELETE语句与 REFERENCE约束"FK_subplan_job_id"冲突.) use msdb select * from sysmaintplan_plans --查看 ...

  4. Protobuf, understand the hood

    proto文件定义 package lm; message Foo{ required int32 id = 1; } message Bar{ required int32 id = 1 [defa ...

  5. 如何禁止C++默认生成成员函数

    前言: 前几天在一次笔试过程中被问到c++如何设计禁止调用默认构造函数,当时简单的想法是直接将默认构造函数声明为private即可,这样的话对象的确不能直接调用.之后查阅了<Effective ...

  6. linux tar使用

    Linux  tar指令简单使用 -c:创建包,-x:解压或解包(-c和-x可理解为互逆运算),-t:查看包 -f:后加处理文件,必须放在参数组合的最后一位(tar  -cf  a.tar  1.tx ...

  7. iframe和response.sendRedirect使用的问题

    一.iframe下使用response.sendRedirect的问题 一般使用filter过滤用户是否登录,如果用户没有登陆则转向登陆页面,这时候可以使用response.sendRedirect( ...

  8. 用python随机生成数据,再插入到postgresql中

    用python随机生成学生姓名,三科成绩和班级数据,再插入到postgresql中. 模块用psycopg2 random import random import psycopg2 fname=[' ...

  9. [linux]linux下开启wifi热点

    网上说用 ap-hotspot可以,但是我测试的时候总是在start的时候卡主,试了以前的版本也是,最后找到了下面的方法. 第一步:安装 plasma-nm 可以使用下面的命令 sudo apt-ge ...

  10. UIViewController的生命周期及iOS程序执行顺序

    UIViewController的生命周期及iOS程序执行顺序     当一个视图控制器被创建,并在屏幕上显示的时候. 代码的执行顺序1. alloc                         ...