一、修改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. nyoj Mod

    Ocean用巧妙的方法得到了一个序列,该序列有N个元素,我们用数组a来记录(下标从0到N−1). Ocean定义f[i]=(((i%a[0])%a[1])%-)%a[N−1]. 现在Ocean会给出Q ...

  2. 虚拟机Vmware成功安装Ubuntu Server 16.04中文版

    最近想在Linux下学习Python的爬虫开发技术,经过认真考虑优先选择在在Ubuntu环境下进行学习Python的开发,虽然Ubuntu Server 16.04 LTS版本已经集成了Python ...

  3. Table点击某个td获取当前列的头名称

    jq代码: $("td").click(function () { var tdHtml = $(this).attr("html"); var index = ...

  4. Python内置函数(43)——type

    英文文档: class type(object) class type(name, bases, dict) With one argument, return the type of an obje ...

  5. 获取apk项目的MD5值和SHA1值

    一些可说可不说的话: * 以前有一个更简单的方法,在as的右边工具栏的 gradle 面板中可以很方便的获取到: * 上次用也是在2年前,时间长了给忘记了,不过我记得我当时写了笔记,这会笔记不在身边, ...

  6. OAuth2.0学习(1-6)授权方式3-密码模式(Resource Owner Password Credentials Grant)

    授权方式3-密码模式(Resource Owner Password Credentials Grant) 密码模式(Resource Owner Password Credentials Grant ...

  7. MySql中的varchar长度究竟是字节还是字符

    今天在设计表的时候,遇到个小问题,由于不知道未来将要存储的数据有多长(数据是通过第三方http接口提供的,根据sample显示,数据大概是如下:) 也就是6个字符. 我在设计表的时候,有点犹豫,本来准 ...

  8. HTML-----<a>、<table>、<form>解析

      超链接 anchor 锚 <a href="url">内容</a> Href Hypertext reference 引用 URL(Uniform Re ...

  9. 剑指offer-二叉树的下一个节点

    题目描述   给定一个二叉树和其中的一个结点,请找出中序遍历顺序的下一个结点并且返回.注意,树中的结点不仅包含左右子结点,同时包含指向父结点的指针.   解题思路 分情况考虑如下: 若该节点为空,则直 ...

  10. Java基础语法<六> 数组 Arrays

    笔记整理 来源于<Java核心技术卷 I > <Java编程思想>   允许数组长度为0 new element[0] 数组长度为0与null不同   1. 数组拷贝 允许将一 ...