H5总结（day01）
来源：互联网 发布：什么网络兼职靠谱 编辑：程序博客网 时间：2024/05/21 12:47
1.H5优势：替代插件，画布，本地存储，数据提取，位置服务，多媒体
2.增加了有语义的结构标签
<header>
<nav>
<article>
<section>
<aside>
<footer>
<hgroup>
<figure>
<figcaption>
3. H5的差异
A. 文档类型
B. 语言lang
C. 不区分大小写，可以混合使用
D. 允许了布尔值（虽然在4.01有的松散规则下也可以）
E. 可以用引号，单引号，不要引号。
F. 可以省略结束标签，例如<p>测试
G. 可以完全省略的标签（比如body，html,head等，但会降低可读性）
4. 新增及删除标签
A. 新增：结构标签，表单标签，媒体标签，其他功能标签（例如：mark标注，progress进度条<max value>，time发布日期、更新日期，ruby,rt,wbr,canvas,details,datalist,source等）
B. 删除：能被css替代（比如font），frame
<embed></embed>
H5表单标签，媒体标签，其他标签，语义结构标签
练习：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="radio" value="1" name="a" />男
<inpUt tYpe="radio" value="2" name="a" checked/>女
<!--
//引号，双引号，单引号
//1.文档类型，2.语言，3.布尔值，4.属性的引号，5.可省略结束标签
//不允许写结束符的标签：area,basebr,col,command,embed,hr,img,input,keygen,link,meta,param,source,track,wbr
//可以省略结束语的标签：li,dt,dd,p,rt,optgroup,option,colgroup,thread,tbody,tr,td,th
//可以完全省略的标签：html,head,body,colgroup,tbody
//新增的结构标签：section,article,aside,header,hgroup
//新增/删除标签
//a.结构标签(section,article,aside,header,hgroup,footer,nav,figure)
// 表单标签
// 媒体标签(video,audio,embed)
// 其他功能标签
//b.可以用CSS替代的标签，不再使用frame，只有个别浏览器支持的标签，其他不常用的标签
-->
<br />
<hr />
<form action="" method="">
电子邮箱：<input type="email" name="email" />
日历：<input type="date" name="time" />
范围range：<input type="range" name="range" min="0" max="100"/>
主页：<input type="url" name="url" />
number：<input type="number" name="number" />
搜索：<input type="search" name="search" />
</form>
<p>i want to show <mark>mark</mark></p>
<progress max="100" value="50"></progress>
<h3>time</h3>
更新日期：<time datetime="2013-10-11T09:00">9:00</time>
发布日期：<time datetime="2013-10-11T09:00" pubdate>9:00</time>
<h3>ruby</h3>
<ruby>
图片
<rt>一张用于显示图片的东西</rt>
<rp>一张用于显示图片的东西</rp>
</ruby>
<h3>wbr</h3>
<p>如果想要学好JAVA，必须勤加练习
<wbr></wbr>
H5新增了很多标签
</p>
<details>
<summary>我的同学</summary>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</details>
<!--
作者：464525021@qq.com
时间：2017-11-28
描述：wbr转换行，若宽度不够，就换行。ruby用处 pubdate,datalist像select
-->
<h3>keygen</h3>
<form action="" method="">
用户名：
<label><input type="text" name="username"/></label>
加密方式：
<keygen name="security" />
<input type="submit" value="提交" />
</form>
<h3>menu</h3>
<menu type="toolbar">
<li>
<input type="checkbox" />
red
</li>
<li>
<input type="checkbox" />
blue
</li>
</menu>
</body>
</html>
浏览器显示：
无法显示
- H5总结（day01）
- day01总结
- day01总结
- day01总结
- day01总结
- day01-day03的总结
- JavaScript总结day01
- H5总结
- h5+ 总结
- H5移动端知识点总结（一）
- H5移动端知识点总结（二）
- H5移动端知识点总结（三）
- H5移动端知识点总结（四）
- H5页面测试点总结（二）
- 数据库day01（1）
- 数据库day01（2）
- day01
- day01
- Web页面未完全渲染：content部分未渲染，与navbar渲染效果相同（关键词：flask/bug）
- 【设计模式】策略模式（Strategy Pattern）
- [Java面试七]Mybatis总结以及在面试中的一些问题
- springMVC学习笔记-要点概述
- mysql常见问题集锦
- H5总结（day01）
- animate.css基本使用
- Java 形参与实参
- 接口
- bionic linker代码分析(1)
- linux文件目录分析之/etc目录
- Spark 重分区coalesce和repartition,合并小文件
- 笔记：linux检测软件包是否安装方法
- Java与JSON之间的相互转换-3
