修改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. JS中var声明与function声明两种函数声明方式的区别

    JS中常见的两种函数声明(statement)方式有这两种: // 函数表达式(function expression) var h = function() { // h } // 函数声明(fun ...

  2. StringBuilder String string.Concat 字符串拼接速度再议

    首先看测试代码: public class StringSpeedTest { "; public string StringAdd(int count) { string str = st ...

  3. Check failed: status == CUBLAS_STATUS_SUCCESS (11 vs. 0) CUBLAS_STATUS_MAPPING_ERROR

    I0930 21:23:15.115576 30918 solver.cpp:281] Learning Rate Policy: multistepF0930 21:23:17.263314 310 ...

  4. VMware下Centos7快速搭建vsftpd

    最简单快捷的实现ftp的功能,不考虑安全问题. 1.配置防火墙和selinux vi /etc/selinux/config # This file controls the state of SEL ...

  5. windows下安装PyTorch0.4.0

    PyTorch框架,据说2018.4.25刚刚上架windows,安个玩玩 我的环境: windows 10 anaconda虚拟环境python3.6 cuda9.1 cudnn7 pytorch  ...

  6. 自学Linux Shell6.3-系统环境变量持久化

    点击返回 自学Linux命令行与Shell脚本之路 6.3-系统环境变量持久化 在你登录Linux系统启动一个bash shell时,默认情况下bash在几个文件中查找命令,这几个文件成为启动文件:b ...

  7. 自学Linux Shell16.3-函数递归+创建库

    点击返回 自学Linux命令行与Shell脚本之路 16.3-函数递归+创建库 1. 函数递归 递归调用函数是指函数调用自身进行求解. 通常,递归函数有基值,函数最终递推到达该值. 许多高级数学算法使 ...

  8. luogu1600 [NOIp2016]天天爱跑步 (tarjanLca+dfs)

    经过部分分的提示,我们可以把一条路径切成s到lca 和lca到t的链 这样就分为向上的链和向下的链,我们分开考虑: 向上:如果某一个链i可以对点x产生贡献,那么有deep[x]+w[x]=deep[S ...

  9. Android log 方法

    package test; public abstract class Logger { private static Class<? extends Logger> mLoggerCla ...

  10. 获取泛型的class 反射

    最近在使用Google的Gson包进行Json和Java对象之间的转化,对于包含泛型的类的序列化和反序列化Gson也提供了很好的支持,感觉有点意思,就花时间研究了一下. 由于Java泛型的实现机制,使 ...