本文章来给大家介绍在css3定义required,focus,valid和invalid样式的方法,此方法目前只支持ie9+及ff,gg浏览器哦。
css3 提示只适用于高级浏览器:
Chrome
Firefox
Safari
IE9+

valid、invalid、required的定义

  1. input:required, input:valid , input:invalid{
  2. border:0 none;
  3. outline: 0 none;
  4. -webkit-box-shadow:none;
  5. -moz-box-shadow:none;
  6. -ms-box-shadow:none;
  7. -o-box-shadow:none;
  8. box-shadow: none;
  9. }
  10. /* by http://www.manongjc.com/article/1327.html */

过去验证表单会通过js和正则去判断填写的内容是否正确,如email的验证。
HTML5的出现为我们提供一些属性,不用编写js和正则即可解决这个检验表单内容。
:required
必须,那input不能为空的意思。
:valid
有效,即当填写的内容符合要求的时候触发。
:invalid
无效,即当填写的内容不符合要求的时候触发。

css required,focus,valid和invalid介绍的更多相关文章

  1. css3中定义required,focus,valid和invalid样式

    css3 提示只适用于高级浏览器: ChromeFirefoxSafariIE9+ valid.invalid.required的定义  代码如下 复制代码 input:required, input ...

  2. apt update 提示 Release file for http://… is not valid yet (invalid for another d..)

    由于在公司里需要使用代理上网,搞了好久,好不容易把 apt 整得可以访问外网了,结果在执行 spt update 时总是提示 Release file for http://- is not vali ...

  3. Difference between Satisfiable, Valid, Unsatisfiable & Invalid

    A formula is satisfiable if it is possible to find an interpretation (model) that makes the formula  ...

  4. css:focus伪类的使用

    css中:focus伪类的使用,即给已获取焦点的元素设置样式 示例一 <!DOCTYPE html> <html lang="en"> <head&g ...

  5. CSS中display:block的使用介绍

    在CSS的规定中,每个页面元素都有一个display的属性,用于确定这个元素的类型是行内元素,还是块级元素: (1)行内元素:元素在一行内水平排列,依附于其他块级元素存在,因此,对行内元素设置高度.宽 ...

  6. Javascript动态引用CSS文件的2种方法介绍

    最近做一个项目,需要javascript动态插入样式,结果以前的方法失效了!查了2个小时的原因竟然是自己手贱,这个最后再说! javascript插入样式在前端开发中应用比较广泛,特别是在修改前端表现 ...

  7. 【css预处理器】------css预处理器及sass基本介绍------【巷子】

    001.什么是css预处理器? css预处理器定义了一种新的语言.用一种专门的编程语言,为css增加了一些编程的特性,将css作为目标生成文件,然后开发者就只要使用这种语言进行编码工作.(通俗点说“” ...

  8. 02.CSS选择器-->:focus

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. css中line-height的理解_介绍line-height实际应用

    一.line-height的定义 css中line-height行高是指文本行基线之间的距离,不同字体,基线位置不同.line-height只影响行内元素和其他行内内容,而不会直接影响块级元素,如果块 ...

随机推荐

  1. eclipse项目里面的类有时候会莫名其妙出现很多错误

    由于eclipse的编译是基于时间戳的判断机制的.因此当你按build   all的时候有些eclipse认为时间戳没有改变的类不会被编译.因此你可以先clean一下再编译.这个时候eclipse会将 ...

  2. mysql命令行导入sql文件

    今天从windows上导出一个sql执行文件,再倒入到unbutn中,结果出现乱码,折腾7-8分钟, 解决方式 在导出mysql sql执行文件的时候,指定一下编码格式: 复制代码代码如下: mysq ...

  3. 【python】unittest中常用的assert语句

    下面是unittest模块的常用方法: assertEqual(a, b)     a == b assertNotEqual(a, b)     a != b assertTrue(x)     b ...

  4. 6.25$post('',function(){});无法触发问题

    试了很久,发现把这个方法放错位置了

  5. Node.js 相关资料网站汇总

    地址:https://cnodejs.org/ nodejs中文网:http://nodejs.cn/ nodejs中文网:http://www.nodejs.net/ 相关API地址:http:// ...

  6. Java I/O学习(附实例和详解)

    原文地址:http://blog.csdn.net/u013142781/article/details/50814649 一.Java I/O类结构以及流的基本概念 在阅读Java I/O的实例之前 ...

  7. 20个超实用的JavaScript技巧及最佳实践

    1.第一次给变量赋值时,别忘记var关键字   给一个未声明的变量赋值,该变量会被自动创建为全局变量,在JS开发中,应该避免使用全局变量.   2.使用===替换==   并且永远不要使用=或!=. ...

  8. IntentService简介

    参照文章:http://android.tgbus.com/Android/tutorial/201106/355229.shtml IntentService是Service类的子类,用来处理异步请 ...

  9. MyEclipse 设置注释

    MyEclipse设置注释的方法 windows-Preferences-(弹出窗口) 单击[Edit]后弹出编辑窗口,然后进行编辑

  10. 单选按钮选中js的处理

    function FinancialinfosetController($scope, $http, $timeout, $location, $rootScope, $routeParams) { ...