怎么修改placeholder字体的css样式
修改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样式的更多相关文章
- jQuery修改class属性和CSS样式
jQuery修改class属性和CSS样式 class属性修改 类属性即class属性,规定类名. 用类选择器规定样式的时候,需要为元素指定类名,即class属性的值. 注意每个HTML元素只有一个c ...
- css 修改placeholder字体颜色字体大小 修改input记住账号密码后的默认背景色
壹 ❀ 引 本来这个阶段的项目页面都是给实习生妹子做的,我只用写写功能接接数据,但这两天妹子要忙翻译,这个工作阶段也快结束了导致有点慌,只能自己把剩余的几个小页面给写了. 那么做页面的过程中,UI也 ...
- 修改html 属性,css样式。
一 通过修改标签属性来改变它的样式 js设置和获取标签的属性 <script type="text/javascript"> window.onload = func ...
- 修改chrome浏览器默认css样式的方法
最近重新用起了ubuntu kylin,然后又碰到之前让我感到有些难受的一个小问题:用chrome浏览部分网页时,一部分粗体字十分难看,就像是宋体直接加粗那样. 之前就觉得这样看起来很难受,但是找到的 ...
- CSS样式----CSS属性:字体属性和文本属性(图文详解)
本文最初于2015-10-04发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重要内容 CSS的单位 字体属性 文本属性 定 ...
- CSS样式----图文详解(二):css属性
主要内容 CSS的单位 字体属性 文本属性 背景属性 列表属性 盒子模型 定位属性:position.float.overflow.z-index等 导航栏的制作 鼠标的属性cursor 滤镜的介绍 ...
- css修改placeholder的样式
css修改placeholder的样式 input::-webkit-input-placeholder { /* WebKit browsers */ font-size:14px; color: ...
- CSS/Compass修改placeholder的文字样式
在HTML5中,<input>与<textarea>标签支持placeholder属性,用来定义无任何输入时的默认文字. 可以通过CSS修改placeholder的文字样式: ...
- CSS如何修改placeholder样式
项目用经常遇到修改input的placeholder的颜色的需求,这里来看一下placeholder如何用css设置: 原文发布与我的个人博客>> 首先来看一下chrome默认的input ...
随机推荐
- 《第一行代码》学习笔记7-活动Activity(5)
1.Intent中只能指定一个action,但却能指定多个category. 2.使用隐式Intent,不仅可以启动自己程序内的活动,还可以启动其他程序的活动,使得Android应用程序之间 的功能共 ...
- BULK INSERT如何将大量数据高效地导入SQL Server
转载自:http://database.51cto.com/art/201108/282631.htm BULK INSERT如何将大量数据高效地导入SQL Server 本文我们详细介绍了BULK ...
- Mysql常用命令记录
-- 导出数据库: mysqldump -u user_name -p database_name > import_file.sql -- 执行脚本 source database.sql
- JasperReport使用心得
1. JasperReport 报表文件视图化生成工具iReport. iReport做为一个生成JasperReport的视图工具,和我们是使用的大多数报表创建工具没有太大的差别,都是拖控件,搭出报 ...
- JS创建对象的七大模式
1. 工厂模式 function createPerson(name, age, job){var o = new Object();o.name = name;o.age = age;o.job = ...
- dedecms likearticle 调用附加表的字段调用方式
[field:id runphp='yes'] $aid = @me; $row = $GLOBALS['dsql']->GetOne("Select 字段名 From `dede_a ...
- CSS3学习之圆角box-shadow,阴影border-radius
最近经常玩腾讯微博,出来职业习惯,看看它的CSS,里面运用了大量的css3的东东,有一处用到了Data URI,还有css expression有争议的地方,对png24图片的处理也是用滤镜,类似( ...
- 文成小盆友python-num2 数据类型、列表、字典
一.先聊下python的运行过程 计算机是不能够识别高级语言的,所以当我们运行一个高级语言程序的时候,就需要一个“翻译机”来从事把高级语言转变成计算机能读懂的机器语言的过程.这个过程分成两类,第一种是 ...
- Gizmos绘制塔防游戏网格
1.画线脚本写法及地面调整 首先,新建脚本GridMap 新建绘制网格方法(初始数值为10*10) 在类中创建变量 //定义地图宽度 public int m_mapWidth = 10; //地图高 ...
- java形参是否会改变实参
之前一直对java这方面感到困惑---传入的形参是否会影响实参.因为c++有指针,而java没有,所以我做一个测试验证形参是否会影响实参.* 首先第一种情况---基本类型 哈哈,其实结果大概和我想的一 ...