修改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. 牛客网练习赛7-B-购物

    在遥远的东方,有一家糖果专卖店. 这家糖果店将会在每天出售一些糖果,它每天都会生产出m个糖果,第i天的第j个糖果价格为C[i][j]元. 现在的你想要在接下来的n天去糖果店进行选购,你每天可以买多个糖 ...

  2. BZOJ2277[Poi2011]Strongbox——数论

    题目描述 Byteasar is a famous safe-cracker, who renounced his criminal activity and got into testing and ...

  3. BZOJ1901Zju2112 Dynamic Rankings——树状数组套主席树

    题目描述 给定一个含有n个数的序列a[1],a[2],a[3]……a[n],程序必须回答这样的询问:对于给定的i,j,k,在a[i],a[i+1 ],a[i+2]……a[j]中第k小的数是多少(1≤k ...

  4. Codeforces Round #419 (Div. 2) C. Karen and Game

    C. Karen and Game time limit per test 2 seconds memory limit per test 512 megabytes input standard i ...

  5. Leetcode 191.位1的个数 By Python

    编写一个函数,输入是一个无符号整数,返回其二进制表达式中数字位数为 '1' 的个数(也被称为汉明重量). 示例 : 输入: 11 输出: 3 解释: 整数 11 的二进制表示为 00000000000 ...

  6. ANDROID content provide 使用实例

    Content Provider提供了一种多应用间数据共享的方式,比如:联系人信息可以被多个应用程序访问.Content Provider是个实现了一组用于提供其他应用程序存取数据的标准方法的类. 下 ...

  7. SharePoint 2013 event id 8321 错误

    SharePoint 2013里会报8321的错误: A certificate validation operation took 15011.1412 milliseconds and has e ...

  8. js的==和===练习

    今天检查了一下JS的== 和===的区别 如下: 表达式                              值 1==true  true 1===true  false 0==false t ...

  9. (转)Maven pom.xml 配置详解

    背景:maven一直感觉既熟悉又陌生,归根结底还是自己不太熟. 1 什么是pom? pom作为项目对象模型.通过xml表示maven项目,使用pom.xml来实现.主要描述了项目:包括配置文件:开发者 ...

  10. 监听INPUT值的即时变化

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...