HTML5基础(五)

加强版的oldl

  1、ol的start属性和reversed属性

1、可以通过start属性来定义标号的开始值。
2、可以通过reversed属性来进行反向编号。




   
   



       
  1. 有序列表A

  2.    
  3. 有序列表B

  4.    
  5. 有序列表C

  6.    
  7. 有序列表D

  8.    
  9. 有序列表E

  10.    
  11. 有序列表F

  12.    
  13. 有序列表G



  2、重新定义含义的dl元素

dl元素在HTML4中:
  dl元素在HTML4中,是一个专门用来定义术语的列表。
dl元素在HTML5中:
  dl元素在HTML5中,把dl元素进行了重定义。每一项包含一条或者多条带名字的dt元素,用来表示术语,dt元素后面紧跟一个或者多个dd元素,用来表示定义。重定义后的dl列表包含多个带名字的列表项。




   
   


介绍



   

《HTML5》


   

《HTML5》主要讲解HTML5的使用方法!


   


l

定义一段对话


 
老师

 
2+2 等于?

 
学生

 
4

 
老师

 
答对了!

 

新增标签的低版本兼容





无标题文档




页面头部


   
   
内容区域


页面底部

刘伟是个胖子

 





无标题文档




页面头部


   
   
内容区域


页面底部


新增表单控件

 

l新的输入型控件

•email : 电子邮箱文本框,跟普通的没什么区别

–当输入不是邮箱的时候,验证通不过

–移动端的键盘会有变化

•tel : 电话号码

•url : 网页的URL

•search : 搜索引擎

–chrome下输入文字后,会多出一个关闭的X

•range : 特定范围内的数值选择器

–min、max、step( 步数 )

–例子 : 用JS来显示当前数值

•number : 只能包含数字的输入框

•color : 颜色选择器

•datetime : 显示完整日期

•datetime-local : 显示完整日期,不含时区

•time : 显示时间,不含时区

•date : 显示日期

•week : 显示周

•month : 显示月


   
   


   
   


   
   


   
   


   
   


   
   


   
   


   
   


   
   


   
   


   
   


   
   


   
   


   
   

新增表单控件

 

新的表单特性和函数

•placeholder : 输入框提示信息

–例子 : 微博的密码框提示

•autocomplete : 是否保存用户输入值

–默认为on,关闭提示选择off

•autofocus : 指定表单获取输入焦点

•list和datalist : 为输入框构造一个选择列表

–list值为datalist标签的id

•required : 此项必填,不能为空

•Pattern : 正则验证 pattern="\d{1,5}“

•Formaction 在submit里定义提交地址


   
   


   
   


   
   
   


   
   
   


   
   
   

 

表单验证

validity对象:

•通过下面的valid可以查看验证是否通过,如果八种验证都通过返回true,一种验证失败返回false

–oText.addEventListener("invalid",fn1,false);

–ev.preventDefault()

–valueMissing : 输入值为空时

–typeMismatch : 控件值与预期类型不匹配

–patternMismatch : 输入值不满足pattern正则

–tooLong : 超过maxLength最大限制

–rangeUnderflow : 验证的range最小值

–rangeOverflow:验证的range最大值

–stepMismatch: 验证range 的当前值是否符合min、max及step的规则

–customError 不符合自定义验证

»setCustomValidity(); 自定义验证

•Invalid事件 : 验证反馈 input.addEventListener('invalid',fn,false)

–阻止默认验证:ev.preventDefault()

•formnovalidate属性 : 关闭验证



   
   




   
   




   
   


 



   
   




   
   


 



   
   




   
   
   

转载于:https://www.cnblogs.com/binperson/p/5495965.html


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部