H5新增属性分为四节内容:
1、Input email url number range Date pickers search color tel
2、表单属性 autocomplete autofocus multiple placeholder required
3、链接属性 link base — target /a超链接
4、其他属性 script ol html style
电子邮件input类型:
统一资源定位符
电话号码 input
数字number类型 — 英文字母以及一些特殊符号不能输入
Date pickers input类型
Date — 年月日
Month — 年月
Week — 年周
Time — 时间(小时和分钟)
Datetime — 时间 年月日时分 (UTC时间)
Datetime-local — 年月日时间(时分) (本地时间)
演示:
年月日
年月
年周
Time — 时间(小时和分钟)
Datetime — 年月日时分 — utc时间
Iphone端的ios10版本之后对这个datetime不再继续兼容
Utc:指的是协调世界时间,又称为世界统一时间
世界标准时间、国际协调时间datetime-local — 本地时间 — 年月日时分
以上就是input新增的属性的类型
Range input类型
Search input类型
Color input类型
表单新增的属性:
1、autocomplete 属性
Form或者input域自动完成的功能
适用于: form
Input类型适用于:text search url tel email password date range color
2、autofocus属性 — 用户友好体验
规定在页面加载时候,域自动获得焦点
总结:
1、autofocus属性适用于所有input标签
2、
3、multiple属性
规定输入的域中可输入多个值
适用于:email类型和file文件类型
4、placeholder属性提供一种提示(hint) 描述输入域所期待的值
Placeholder=”…….”
适用于:text search url tel email password
5、required属性
规定必须在提交之前填写输入项(校验不能为空)
适用于:text search url tel email password date pickers number checkbox radio file
其他标签 :
1、链接标签属性
Sizes:根据不同分辨率引用不同的sizes
2、Targe属性
Base一般写在head标签中
http://192.1313.3414/demo/index.html
http://192.1313.3414/demo/login.html
3、超链接
1、media=”” handheld:手持端 tv:电视设备 后台根据media的值可以判断事手持端还是pc端还是tv端
2、hreflang=”” zh:设置的语言事中文 en:英文
3、rel=”external” (设置超链接的引用,这里的链接为外部链接)
4、script标签
1、用于定义客户端的文本 JavaScript
2、包裹脚本 src属性指向外部脚本文件
用于图像的制作以及表单验证 动态内容的改变
其他的属性:
1、defer:规定当前页面已完成加载后,才会执行的脚本
2、async:规定一旦脚本可用,则会异步执行
演示顺序:先执行defer 后发现async几乎和其余内容同时执行
标签属性:
Ul 无序列表
Ol有序列表
Ol里面的有序列表 — 其他属性
1、start — 起始值
2、Reversed — 倒序排列
Html和style属性
Html:manifest=”cache.manifest” (定义页面离线应用文件)
总结:
1、input 标签的属性 emial tel 手持端 color date time 电脑端设置比较牛
2、属性
3、链接 — 理论
4、HMLT5