修改placeholder字体颜色

html5为input添加了原生的占位符属性placeholder,高级浏览器都支持这个属性,例如:

<input type="text" placeholder="热门推荐" value=" ">
默认的placeholder字体颜色是呈浅灰色,如果想改变这个默认颜色,解决方案如下:

input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #f00;
} input::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #f00;
} input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: #f00;
} input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #f00;
}

input上焦点时,去掉焦点框

input{outline:none} 

改变光标颜色而不影响字的颜色

input{caret-color:red;}

也可参考文章:如何改变表单控件光标颜色

input框美化

参考博文:input框focus时的美化效果

表单之input的样式修改的更多相关文章

  1. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

  2. vue教程1-01 v-model 一般表单元素(input) 双向数据绑定

    vue教程1-01   v-model 一般表单元素(input) 双向数据绑定el:'#box',//这里放的是选择器.不然会不生效 <!DOCTYPE html> <html l ...

  3. 课时44.表单标签-input(掌握)

    1.什么是表单? 表单是专门用收集用户信息的 2.什么是表单元素? 2.1什么是元素? 在HTML中,标签/标记/元素都是指HTML中的标签 例如: <a>a标签/a标记/a元素 表单元素 ...

  4. HTML表单之input元素的23种type类型

    摘自:http://www.cnblogs.com/xiaohuochai/p/5179909.html 了解HTML表单之input元素的23种type类型 随着HTML5的出现,input元素新增 ...

  5. 去掉或者修改 input、select 等表单的【默认样式 】

    隐藏input等表单的默认样式的背景: textarea,select,input{-webkit-appearance: none; -moz-appearance: none; -o-appear ...

  6. 修改 jquery easyui 表单验证默认的样式

    目前对于不符合要求的输入域会在右侧显示一个带箭头的提示,可是如果我的输入框比较靠右的话就显示不全了(虽然会出滚动条,但是由于鼠标移开就消失了,所以还是看不到提示内容)! 能不能把这个提示的位置改变一下 ...

  7. 了解HTML表单之input元素的23种type类型

    目录 传统类型 text password file radio checkbox hidden button image reset submit 新增类型 color tel email url ...

  8. 了解HTML表单之input元素的30个元素属性

    目录 传统属性 name type accept alt checked disabled readonly maxlength size src value 新增属性 autocomplete au ...

  9. 在表单(input)中id和name的区别

    但是name在以下用途是不能替代的: 1. 表单(form)的控件名,提交的数据都用控件的name而不是id来控制.因为有许多name会同时对应多个控件,比如checkbox和radio,而id必须是 ...

随机推荐

  1. C#利用反射来判断对象是否包含某个属性的实现方法

    本文实例展示了C#利用反射来判断对象是否包含某个属性的实现方法,对于C#程序设计人员来说有一定的学习借鉴价值. 具体实现代码如下: /// <summary> /// 利用反射来判断对象是 ...

  2. BZOJ3425[POI2013]Polarization——DP+bitset+分块

    题目描述 Everyone knew it would only be a matter of time. So what? Faced for years on, a peril becomes t ...

  3. BZOJ2017[USACO 2009 Nov Silver 1.A Coin Game]——DP+博弈论

    题目描述 农夫约翰的奶牛喜欢玩硬币游戏,因此他发明了一种称为“Xoinc”的两人硬币游戏. 初始时,一个有N(5 <= N <= 2,000)枚硬币的堆栈放在地上,从堆顶数起的第I枚硬币的 ...

  4. POJ3122-Pie-二分答案

    有N个派,F+1个人,每个人分到的体积要相等,而且每个人只能有一块派. 二分答案,对于一个mid,对每个派进行检测,尽量的多分,然后如果份数比F+1大,说明mid可以更大,就把mid给low.注意份数 ...

  5. Java中的split函数拆分后变成null的问题

    对于一些特殊的情况,split拆分后并没有保留全的元素 如下例子: String x ="a,,,,,,"; String []y = x.split(",") ...

  6. Real mode & Protected mode

    [转]  https://objectkuan.gitbooks.io/ucore-docs/content/lab1/lab1_3_2_1_protection_mode.html 为何要了解Int ...

  7. iOS 【终极方案】精准获取webView内容高度,自适应高度

    前言:是这样的,刚写完上一篇文章还没缓过神来,上一篇文章我还提到了,想和大家聊聊原生+H5如何无缝连接的故事.结果我朋友就给我发了两篇他的作品.他的做法也都有独到之处.好的文章都是这样,让你每次看都能 ...

  8. Python的二叉树实现

    二叉树需要实现的功能及思路 找到最小值 没什么好说的就是二叉树最左下的顶点 找到最大值 没什么好说的就是二叉树最右下的顶点 插入 分情况,如果二叉树为空那么直接直接设置成根节点就好了.否则就逐层向下, ...

  9. 洛谷 P2300 合并神犇 解题报告

    P2300 合并神犇 题目背景 loidc来到了NOI的赛场上,他在那里看到了好多神犇. 题目描述 神犇们现在正排成一排在刷题.每个神犇都有一个能力值p[i].loidc认为坐在附近的金牌爷能力参差不 ...

  10. 洛谷 P3705 [SDOI2017]新生舞会 解题报告

    P3705 [SDOI2017]新生舞会 题目描述 学校组织了一次新生舞会,\(Cathy\)作为经验丰富的老学姐,负责为同学们安排舞伴. 有\(n\)个男生和\(n\)个女生参加舞会买一个男生和一个 ...