修改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. Baltic Dry Index

    波罗的海干散货指数(Baltic Dry Index,缩写BDI),是航运业的经济指标,它包含了航运业的干散货交易量的转变. BDI波罗的海指数是由几条主要航线的即期运费(Spot Rate)加权计算 ...

  2. 工作流管库的bpmn部署在数据库中

    工作流管库的bpmn部署在数据库中 DB_schema_update_false  没有表则创建 有表则报错 DB_SCHEMA_UPDATE_TRUE 没有表则创建 有表则不创建 脚本更新则更新数据 ...

  3. python 模块之-logging

    python  模块logging import logging ###  简单使用格式    日志级别等级CRITICAL > ERROR > WARNING > INFO > ...

  4. JPQL模糊匹配单个字符

    JPQL模糊匹配,不是%,而是单个字符,该怎么办?比如我要查出数据库中满足后三位是数字的字符串 对于mysql来说,使用通配符 %和_可以轻松解决,但是对于JPQL来说模糊查询就伤脑筋了... 有一个 ...

  5. BZOJ 3745: [Coci2015]Norma(分治)

    题意 给定一个正整数序列 \(a_1, a_2, \cdots, a_n\) ,求 \[ \sum_{i=1}^{n} \sum_{j=i}^{n} (j - i + 1) \min(a_i,a_{i ...

  6. 【BZOJ2244】[SDOI2011]拦截导弹(CDQ分治)

    [BZOJ2244][SDOI2011]拦截导弹(CDQ分治) 题面 BZOJ 洛谷 题解 不难发现这就是一个三维偏序+\(LIS\)这样一个\(dp\). 那么第一问很好求,直接\(CDQ\)分治之 ...

  7. 2019.3.18考试&2019.3.19考试&2019.3.21考试

    2019.3.18 C O D E T1 树上直接贪心,环上for一遍贪心 哇说的简单,码了将近一下午终于码出来了 感觉自己码力/写题策略太糟糕了,先是搞了一个细节太多的写法最后不得不弃疗了,然后第二 ...

  8. 【洛谷P1429】平面最近点对

    题解:直接在输入点对的基础上建立 kd-tree,再每次以每个节点的坐标查询离这个点最近的点即可,同时需要忽略这个点本身对该点答案的贡献. 另外,直接在这些点上建立 kd-tree 会比一个一个插入点 ...

  9. 代码实战之AdaBoost

    尝试用sklearn进行adaboost实战 & SAMME.R算法流程,博客地址 初试AdaBoost SAMME.R算法流程 sklearn之AdaBoostClassifier类 完整实 ...

  10. 十一、java线程

    目录: 一.线程的基本概念 二.线程的创建和启动 三.线程的调度和优先级 四.线程的状态控制 五.线程同步 一.线程的基本概念 线程是一个程序内部的顺序控制流 线程和进程的区别: 每个进程都由独立的代 ...