html5中valid、invalid、required的定义


Posted in HTML / CSS onFebruary 21, 2014

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;}

过去验证表单会通过js和正则去判断填写的内容是否正确,如email的验证。

HTML5的出现为我们提供一些属性,不用编写js和正则即可解决这个检验表单内容。
:required
必须,那input不能为空的意思。

:valid
有效,即当填写的内容符合要求的时候触发。

:invalid
无效,即当填写的内容不符合要求的时候触发。

HTML / CSS 相关文章推荐
CSS3的新特性介绍
Oct 31 HTML / CSS
CSS改变网页中鼠标选中文字背景颜色例子
Apr 23 HTML / CSS
基于html和CSS3制作酷炫的导航栏
Sep 23 HTML / CSS
结合CSS3的布局新特征谈谈常见布局方法
Jan 22 HTML / CSS
使用CSS变量实现炫酷惊人的悬浮效果
Apr 26 HTML / CSS
Canvas 文字碰撞检测并抽稀的方法
May 27 HTML / CSS
W3C公布最新的HTML5标准草案
Oct 17 HTML / CSS
HTML5的标签的代码的简单介绍 HTML5标签的简介
May 28 HTML / CSS
html5 canvas移动浏览器上实现图片压缩上传
Mar 11 HTML / CSS
HTML5事件方法全部汇总
May 12 HTML / CSS
HTML实现代码雨源码及效果示例
Feb 25 HTML / CSS
基于CSS制作创意端午节专属加载特效
Jun 01 HTML / CSS
html5实现多文件的上传示例代码
Feb 13 #HTML / CSS
HTML5 video 视频标签使用介绍
Feb 03 #HTML / CSS
html5通过canvas实现刮刮卡效果示例分享
Jan 27 #HTML / CSS
html5画布旋转效果示例
Jan 27 #HTML / CSS
html5中svg canvas和图片之间相互转化思路代码
Jan 24 #HTML / CSS
HTML5 canvas画图并保存成图片的jcanvas插件
Jan 17 #HTML / CSS
Html5无刷新修改browser Url的方法
Jan 15 #HTML / CSS
You might like
ThinkPHP3.1新特性之对Ajax的支持更加完善
2014/06/19 PHP
PHP中读取文件的8种方法和代码实例
2014/08/05 PHP
Symfony2函数用法实例分析
2016/03/18 PHP
window.location.hash 使用说明
2010/11/08 Javascript
读jQuery之八 包装事件对象
2011/06/21 Javascript
document.getElementBy("id")与$("#id")有什么区别
2013/09/22 Javascript
js 实现浏览历史记录示例
2014/04/20 Javascript
基于jquery实现在线选座订座之影院篇
2015/08/24 Javascript
Angular.js 实现数字转换汉字实例代码
2016/07/14 Javascript
Vue.js每天必学之组件与组件间的通信
2016/09/08 Javascript
jQuery使用getJSON方法获取json数据完整示例
2016/09/13 Javascript
three.js快速入门【推荐】
2017/01/21 Javascript
微信小程序开发背景图显示功能
2018/08/08 Javascript
详解javascript对数组和json数组的操作
2019/04/15 Javascript
Element-UI中关于table表格的那些骚操作(小结)
2019/08/15 Javascript
vue 内联样式style中的background用法说明
2020/08/05 Javascript
九步学会Python装饰器
2015/05/09 Python
简单介绍Python中的readline()方法的使用
2015/05/24 Python
Python使用PIL库实现验证码图片的方法
2016/03/11 Python
python django 访问静态文件出现404或500错误
2017/01/20 Python
Python测试网络连通性示例【基于ping】
2018/08/03 Python
Python异步操作MySQL示例【使用aiomysql】
2019/05/16 Python
python调用并链接MATLAB脚本详解
2019/07/05 Python
Python网络编程之使用TCP方式传输文件操作示例
2019/11/01 Python
详解centos7+django+python3+mysql+阿里云部署项目全流程
2019/11/15 Python
Python使用Pandas读写Excel实例解析
2019/11/19 Python
中国宠物用品商城:E宠商城
2016/08/27 全球购物
幼儿园教师工作感言
2014/02/15 职场文书
学生社团文化节开幕式主持词
2014/03/28 职场文书
交通事故私了协议书
2014/04/16 职场文书
骨干教师考核方案
2014/05/09 职场文书
购房协议书范本(无房产证)
2014/10/07 职场文书
干部职工纪律作风整改措施思想汇报
2014/10/11 职场文书
城管年度个人总结
2015/02/28 职场文书
门面租赁合同范文
2019/08/06 职场文书
django 认证类配置实现
2021/11/11 Python