html5_03_标签的属性变化

 

input标签

 1 <input type="" name="" >
 2 
 3 type=email
 4 type=url --only iphone
 5 type=tel
 6 type=number 限制只能输入可参与运算的数字 + - . e 对数
 7 
 8 、 *存在兼容性问题 
 9 
10 Date Picker Input
11 Date 年月日
12 Month 月 年
13 Week 周 年
14 Time 小时 分钟
15 
16 Datetime 年月日时间 utc opera saferia
17 Datime-local 本地的 chrome opera sarfria
18 
19 Range Input type="range" min="1" max="10"
20 Search input type="search"
21 Color input type="color"

 

表单属性

 1 -- Autocomplete
 2 <form action="index.php?type=1" autocomplete="on" >
 3 <input type="text" name="type" >
 4 <input type="email" autocomplete="off">      关闭自动完成
 5 <input type="submit">
 6 </form>
 7 
 8 
 9 -- Autoforcus 适用于 input 标签
10 <form action="index.php?type=1" autocomplete="on" >
11 <input type="text" name="type" autoforcus="autoforcus" >   自动定位光标到输入框
12 <input type="email" autocomplete="off">　　
13 <input type="submit">
14 </form>

 

-- Multiple 属性 上传多个文件

1 <input type="file" multiple="multiple">　　 多文件上传
2 <input type="email" multiple="multiple">   告诉后端有两个邮件地址。

 

-- Placeholder 提示hint
js onForcus判断鼠标焦点
-适用于 text search url tel email password


-- 表单

bootstrap框架解决了表单提交的问题
验证表单:
- js 表单验证

1 - required
2 <input type="text" name="text" required="required">
3 <input type="email" required="required" >
4 text search url tel email password date pickers number checkbox redio file
5 hidden 隐藏域 不支持required

 


【链接属性】


sizes

<link rel="icon" href="icon.gif" type="image/gif" sizes="16x16">gif格式的
<link rel="icon" href="images/favicon.gif" >
size 根据不同分辨率设置大小引入不同的size

 

target

<header> 所有的之后的连接都自动加上这些属性
<base href="http://localhost/" target="_blank" > // 默认的属性是_self
</header>

<a href="index.php?article_id="{{article_id}}" > </a>

 

a 超链接

- a:media="" 针对终端的设备而进行继续的优化
- a:hreflang="zh" 设置语言
- a:rel="external"    设置超链接引用 这里的超连接是外部的连接

 

script 标签

- defer 同步执行脚本 兼容性差 onlu IE
<script defer src="URL" > </script>
<script defer="defer" src="URL">

- async 异步执行脚本 兼容主流浏览器
<script async src="URL" > </script>
<script async="async" src="URL"> </script>

 

ol
start 起始位置 reverse 倒序排列

<ol start="10" reversed>
<li> Html</li>
<li> Css </li>
<li> Js </li>
</ol>

 


manifest
manifest="cache.manifest" 定义离线应用文件
index.html 关闭了浏览器 还能正常使用 页面离线

style 结构和表现分离 因此不推荐
scoped: 内嵌css
<style scoped>
</style>

 

html5 高级

- API开发 预先定义的一些函数, 针对h5提供的api
- js 控制api

- Canvas 画布 js operate api

- html5 & app
　　web stotage local storage

 

posted @ 2017-08-10 15:26  silvercell  阅读(2536)  评论(0)    收藏  举报