css required,focus,valid和invalid介绍
本文章来给大家介绍在css3定义required,focus,valid和invalid样式的方法,此方法目前只支持ie9+及ff,gg浏览器哦。
css3 提示只适用于高级浏览器:
Chrome
Firefox
Safari
IE9+
valid、invalid、required的定义
input:required, input:valid , input:invalid{
border:0 none;
outline: 0 none;
-webkit-box-shadow:none;
-moz-box-shadow:none;
-ms-box-shadow:none;
-o-box-shadow:none;
box-shadow: none;
}
/* by http://www.manongjc.com/article/1327.html */
过去验证表单会通过js和正则去判断填写的内容是否正确,如email的验证。
HTML5的出现为我们提供一些属性,不用编写js和正则即可解决这个检验表单内容。
:required
必须,那input不能为空的意思。
:valid
有效,即当填写的内容符合要求的时候触发。
:invalid
无效,即当填写的内容不符合要求的时候触发。
css required,focus,valid和invalid介绍的更多相关文章
- css3中定义required,focus,valid和invalid样式
css3 提示只适用于高级浏览器: ChromeFirefoxSafariIE9+ valid.invalid.required的定义 代码如下 复制代码 input:required, input ...
- apt update 提示 Release file for http://… is not valid yet (invalid for another d..)
由于在公司里需要使用代理上网,搞了好久,好不容易把 apt 整得可以访问外网了,结果在执行 spt update 时总是提示 Release file for http://- is not vali ...
- Difference between Satisfiable, Valid, Unsatisfiable & Invalid
A formula is satisfiable if it is possible to find an interpretation (model) that makes the formula ...
- css:focus伪类的使用
css中:focus伪类的使用,即给已获取焦点的元素设置样式 示例一 <!DOCTYPE html> <html lang="en"> <head&g ...
- CSS中display:block的使用介绍
在CSS的规定中,每个页面元素都有一个display的属性,用于确定这个元素的类型是行内元素,还是块级元素: (1)行内元素:元素在一行内水平排列,依附于其他块级元素存在,因此,对行内元素设置高度.宽 ...
- Javascript动态引用CSS文件的2种方法介绍
最近做一个项目,需要javascript动态插入样式,结果以前的方法失效了!查了2个小时的原因竟然是自己手贱,这个最后再说! javascript插入样式在前端开发中应用比较广泛,特别是在修改前端表现 ...
- 【css预处理器】------css预处理器及sass基本介绍------【巷子】
001.什么是css预处理器? css预处理器定义了一种新的语言.用一种专门的编程语言,为css增加了一些编程的特性,将css作为目标生成文件,然后开发者就只要使用这种语言进行编码工作.(通俗点说“” ...
- 02.CSS选择器-->:focus
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- css中line-height的理解_介绍line-height实际应用
一.line-height的定义 css中line-height行高是指文本行基线之间的距离,不同字体,基线位置不同.line-height只影响行内元素和其他行内内容,而不会直接影响块级元素,如果块 ...
随机推荐
- IIS SMTP status codes
Here are the meaning of SMTP status codes. Status Code Description 211 System status, or system help ...
- Dell vsotro 14 3000系列从win10重装win7
1. F2启动进入新的BIOS界面,首先Disable Secure Boot,然后把UEFI改为Legeacy模式,当然是改不回来的,不知道为什么: 2. 插入U盘(老毛桃+UEFI启动镜像): 3 ...
- Learning Core Data 1
What is Core Data? If you want to build anything beyond the most simplistic apps for iOS, you’ll nee ...
- EditPlus去行号/行标
正则表达式1: [0-9] ---------- > 1 2 3 正则表达式1: [0-9]+: ---------- > 1: 2: 3: 正 ...
- 准备学一学go-lang啦 ~~ 学习Go应该用什么姿势? !
go毕竟是新语言,没有那么多历史包袱,并且是google出品,c语言创始人为语言设计组成员,应该还是不错的. go天生具有并行能力,这个在现代服务器端编程领域作用很显而易见,高效服务,快速编码,适合互 ...
- [jQuery]attr和prop的区别
转自:http://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html 在高版本的jquery引入prop方法后,什么时候 ...
- 问对于一个给定的n,怎样才能用最少的步骤将它变到1
如果n为偶数,则将它除以2,如果n为奇数,则将它加1或者减1.问对于一个给定的n,怎样才能用最少的步骤将它变到1.例如:n= 61n-- 60n/2 30n/2 15n++ 16n/2 8n/2 4n ...
- 一起刑事案件法庭辩护 z
[案件地位] 这是一起各方争议很大的刑事案件.侦查机关曾将该案以非法拘禁罪立案侦查,以故意杀人罪移送检察机关审查起诉,公诉机关以非法拘禁形成故意伤害(致死)起诉,而法院最终以故意伤害罪判决,并且排除 ...
- 在windows下使用linux命令
<转:http://www.cnblogs.com/adgnat/archive/2011/07/16/2108098.html> 使用过linxu的伙计估计都会喜欢上linux各种各样强 ...
- Jmeter html 报告中添加90% line time
转载南风_real博客园:http://www.cnblogs.com/jaychang/p/5784882.html 首先上效果图: 其次明白几个原理: 90% Line的意思是:一组数由小到大进行 ...