一、修改input元素placeholder属性样式

在做项目的时候,一般表单元素的placeholder属性样式都是使用浏览器默认的,但有时候为了追求设计上的美感需要修表单元素的placeholder样式(也有可能是遇到了一个处女座的设计师或者是客户),就不等不修改一下placeholder的样式。可以通过下面的代码修改样式:

/*Chrome、Safari等 webkit内核浏览器*/
::-webkit-input-placeholder{
color:red;
} /*Firefox*/
::-moz-placeholder{
color:red;
} /*IE、Edge等 Trident 内核浏览器*/
:-ms-input-placeholder{
color:red;
}

二、清除IE浏览器中input元素的删除和查看密码图标

在IE、Edge等 Trident 内核浏览器中,type = “text” 的 input元素中有输入时会出现清除图标,type = “password” 的 input元素中有输入时会出现眼睛图标。如图:

         

添加下面的样式可以去除默认图标:

::-ms-clear,
::-ms-reveal{
display: none;
}

修改表单元素中placeholder属性样式、清除IE浏览器中input元素的清除图标和眼睛图标的更多相关文章

  1. element-ui修改表单自带验证的样式

    1.比如重写在表单自带验证的样式 .el-form-item__error是对应是的文字的类名,图标我是通过伪元素插进去的 下面是伪元素代码 基本上要重写样式的,到控制台看样式名,因为是封装的,所以有 ...

  2. CSS3过渡结束监听事件,清除/修改表单元素的一些默认样式

    document.querySelector('div').addEventListener('transitionEnd',function(){ console.log('过度结束') }) 如果 ...

  3. Jquary入门(添加 修改 表单元素)+ JSON+弹框

    字符串拼接 计算机语言 都是 对  数据的处理(获取/修改数据)  添加元素  除了  固定的方法添加 以外 都是   字符串拼接(拼接成固定格式即可执行). 1.表单添加元素  append() 方 ...

  4. input placeholder属性 样式修改(颜色,大小,位置)

    placeholder属性 样式修改 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  5. jquery.form插件中动态修改表单数据

    jquery.form jquery.form插件(http://malsup.com/jquery/form/)是大家经常会用到的一个jQuery插件,它可以很方便将表单转换为ajax的方式进行提交 ...

  6. form表单与CSS选择器和样式操作

    form表单 """获取前端用户数据并发送给后端服务器""" <form action=""></fo ...

  7. form表单标签的enctype属性的作用

    Enctype是指定将数据回发到server时浏览器使用的编码类型.其编码类型有下面三种 一. application/x-www-form-urlencoded         这是通过表单发送数据 ...

  8. 统一修改表单参数(表单提交的空字符串统一转null)

    统一修改表单参数(表单提交的空字符串统一转null) 1.介绍: 我们业务中有时会遇到提交的表单中某个参数为空字符串,导致后台接受的为空字符串("")而不是我们理想中的null,会 ...

  9. javaweb修改表单参数---使用过滤器

    需求: 所有的字段要将空字符串转成null: 问题: 我们知道表单如果不写值的时候,传递到后台的不是null,而且是空字符串.那么怎么改成null呢? 解决: 使用过滤器,将请求的参数修改过后继续,再 ...

随机推荐

  1. Junit 4 测试中使用定时任务操作

    难度:测试中执行线程操作 package com.hfepc.job.dataCollection.test; import java.util.Date; import java.util.List ...

  2. JAVA_SE基础——57.有了包之后类与类之间的访问使用import语句

    代码1访问代码2 代码1: class Demo3 { public static void main(String[] args) { Demo4 a = new Demo4(); a.print( ...

  3. 阿里云API网关(18)请求报文和响应报文

    网关指南: https://help.aliyun.com/document_detail/29487.html?spm=5176.doc48835.6.550.23Oqbl 网关控制台: https ...

  4. ssh_maven的搭建之dao层的开发

    之前都是使用我们传统的方式进行引入jar包,现在我们使用maven进行管理依赖,这样,我们的jar就不需要我们进行管理,而且,我们的maven还可以进行项目构建,一个项目从编写源代码到编译,测试,运行 ...

  5. 从Mybatis源码理解jdk动态代理默认调用invoke方法

    一.背景最近在工作之余,把开mybatis的源码看了下,决定自己手写个简单版的.实现核心的功能即可.写完之后,执行了一下,正巧在mybatis对Mapper接口的动态代理这个核心代码这边发现一个问题. ...

  6. NOPI实现导入导出泛型List,支持自定义列

    概述 业务上需要自定义列的Excel的导入导出,在网上看了好多资料,很多都是有Bug而且都是支持Excel和DataTable的转换,所以自己总结了一下,应用.NET平台上的NPOI封装了支持自定义列 ...

  7. leetcode算法:Reshape the Matrix

    In MATLAB, there is a very useful function called 'reshape', which can reshape a matrix into a new o ...

  8. [洛谷P2234][HNOI2002] 营业额统计 - Treap

    Description Tiger最近被公司升任为营业部经理,他上任后接受公司交给的第一项任务便是统计并分析公司成立以来的营业情况. Tiger拿出了公司的账本,账本上记录了公司成立以来每天的营业额. ...

  9. 教你如何用AST语法树对代码“动手脚”

    个推安卓工程师,负责公司移动端项目的架构和开发,主导移动端日志管理平台系统架构和开发工作,熟悉前后端的技术线,参与个推SDK主要业务研发工作,善于解决项目中遇到的痛点问题. 作为程序猿,每天都在写代码 ...

  10. linux内核源码分析 - nvme设备的初始化

    本文为原创,转载请注明:http://www.cnblogs.com/tolimit/ 本文基于3.18.3内核的分析,nvme设备为pcie接口的ssd,其驱动名称为nvme.ko,驱动代码在dri ...