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