H5表单中placeholder属性的字体颜色问题
最近做项目的时候遇到的一些小样式问题,有关表单。并且在接下来几天的面试人中五个人都没有回答上来,改变placeholder属性的默认字体颜色,感觉有必要总结一下。

如何改变默认字体的颜色?
@blue: #026b9c;
input {
width: 100%;
height: 74/30rem;
line-height: 74/30rem;
color: @blue;
border-radius: 16/30rem;
border: 1px solid @blue_light;
font-size: 28/30rem;
padding-left: 15/30rem;
}
input::-webkit-input-placeholder {
/* WebKit browsers */
color: @blue;
}
input:-moz-placeholder {
/* Mozilla Firefox 4 to 18 */
color: @blue;
}
input::-moz-placeholder {
/* Mozilla Firefox 19+ */
color: @blue;
}
input:-ms-input-placeholder {
/* Internet Explorer 10+ */
color: @blue;
}
主要是通过伪元素+私有前缀这种方式实现,具体实现机制暂时不甚了解,存在兼容性问题。。。当我问这个问题的时候,希望有更好的办法?不过好多人把input的color,甚至于background-color都搞混淆了,好尴尬。
H5表单中placeholder属性的字体颜色问题的更多相关文章
- iOS 修改UITextField的placeholder属性的字体颜色(修改UITextField占位符字体的颜色)
只要把原来的placeholder属性改为attributedPlaceholder属性即可 具体代码如下图:
- 如何更改placeholder属性中文字颜色
如何更改placeholder属性中文字颜色 placeholder这个属性是HTML5中新增的属性,该属性的作用是规定可描述输入字段预期值的简短的提示信息,该提示会在用户输入之前显示在输入字段中,会 ...
- 移动端input的disabled属性对字体颜色影响
对于表单输入,input是很好的选择,这次记录主要是正对input的value值字体在Android和iOS(11)设备下显示不同问题: 如下图:1.2的区别主要是分别设置disabled.reado ...
- input placeholder属性 样式修改(颜色,大小,位置)
placeholder属性 样式修改 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- HTML5之placeholder属性以及如何更改placeholder属性中文字颜色
今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下. 熟悉HTML5的人应 ...
- 转: HTML5之placeholder属性以及如何更改placeholder属性中文字颜色
今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下. 熟悉HTML5的人应 ...
- 关于ie8下disabled属性:字体颜色问题
在ie8下,input/textarea输入框如果使用disabled属性,字体的颜色会变灰,这时我们可以使用另一种方法实现它. 不使用disabled,用readonly代替: input[read ...
- form表单中enctype属性作用
上传文件时,提交的表单属性里需要加enctype="multipart/form-data",才能提交文件信息,不然会报错.那么enctype属性的作用是什么?就是设置表单传输的编 ...
- JS处理数组内如果相同ID追加一个属性(如字体颜色)
var arr=[{id:0},{id:0},{id:3},{id:2},{id:0},{id:4},{id:0},{id:1},{id:1},{id:2},{id:2}]; for(var i=0; ...
随机推荐
- mysql分组函数
组函数针对的是指定字段的非空值.注意:where子句中不能出现组函数!!! avg() 平均值(只能针对数值型 ) max() 最大值(不限制类型) min() 最小值(不限制类型) ...
- Git Pro - (2)分支
Git 保存的不是文件差异或者变化量,而只是一系列文件快照. 在 Git中提交时,会保存一个提交(commit)对象,它包含一个指向暂存内容快照的指针,作者和相关附属信息,以及一定数量(也可能没有)指 ...
- 在 Typescript 2.0 中使用 @types 类型定义
在 Typescript 2.0 中使用 @type 类型定义 基于 Typescript 开发的时候,很麻烦的一个问题就是类型定义.导致在编译的时候,经常会看到一连串的找不到类型的提示.解决的方式经 ...
- According to TLD or attribute directive in tag file, attribute test does not accept any expressions
HTTP Status 500 - /WEB-INF/views/emp/list.jsp (line: 30, column: 4) According to TLD or attribute di ...
- git Could not read from remote repository 解决
错误: fatal: 'origin' does not appear to be a git repository fatal: Could not read from remote reposit ...
- java内存分配和String类型的深度解析
[尊重原创文章出自:http://my.oschina.net/xiaohui249/blog/170013] 摘要 从整体上介绍java内存的概念.构成以及分配机制,在此基础上深度解析java中的S ...
- closest应用(向上查找最近的资料)
//新增网址信息function AddSitInfo(a) { var obj = $(a).closest("td[name='POIRestaurant_Reference_UR ...
- etcd api 接口
etcd api接口 基本操作api: https://github.com/coreos/etcd/blob/6acb3d67fbe131b3b2d5d010e00ec80182be4628/Doc ...
- XMl.02-约束
DTD约束 DTD的书写位置 XML构建模块 DTD定义元素 DTD属性的定义 DTD实体的定义 schema约束 命名空间 schema约束的书写流程 XML被设计为一种很灵活的标记文档. 但是,有 ...
- Tomcat和JavaWeb笔记
<iframe src="http://www.xmind.net/embed/XFXh" width="900px" height="540p ...