HTML5 APP从入门到精通

• 文档说明
• 版本说明
• 第一章 HTML入门
  • 1.3 HTML 新增元素
    • 1.3.1 结构元素
    • 1.3.2 功能元素
  • 1.7 HTML5 新增全局属性
  • 1.8 HTML5 其他功能
• 第二章 HTML5文字和板式变化
  • 2.3 设计段落板式
    • 2.3.1 设置段落样式
    • 2.3.2 设置对齐和缩进

文档说明

作者	日期
方鑫	2018-03-16

版本说明

版本	日期	作者	修改总结
V1.0	2018-03-16	方鑫	更新第一章
V1.0.1	2018-03-18	方鑫	第一章补充

第一章 HTML入门

1.3 HTML 新增元素

1.3.1 结构元素

元素名称	说明
header	标记头部区域的内容（用于整个页面或页面中的一块区域）
footer	标记脚部区域的内容（用于整个页面或页面的一块区域）
section	Web页面中的一块区域
article	独立的文章内容
aside	相关内容或者引文
nav	导航类辅助内容

1.3.2 功能元素

figure 元素：表示一段独立的流内容，一般表示文档主题流内容中的一个独立单元。使用figcaption元素组添加标题，例如:

<figure>
    <figcaption>标题</figcaption>
    <p>内容。。。</p>
</figure>

1.7 HTML5 新增全局属性

contentEditable属性

设置contentEditable属性可以使该元素变成可编辑

<ul contenteditable="true">
    <li>列表元素1</li>
    <li>列表元素1</li>
    <li>列表元素1</li>
</ul>

designMode 属性

designMode属性用来指定整个页面是否可以编辑，designMode属性只能在JavaScript脚本里面被编辑

document.designMode="on"

hidden属性

通知浏览器不渲染该元素，处于不可见状态

spellcheck属性

执行拼写检查

<!--以下两种书写正确-->
<textarea spellcheck="true">
<input type=text spellcheck="false" >
<!--以下书写方法错误-->
<textarea spellcheck>

1.8 HTML5 其他功能

Html标记：更新的HTML5编辑。
canvas 2D：画布技术，通过脚本动态渲染位图图像。
Web Messaging：跨文档消息通信。例如：向IFrame中的HTML发送消息。
Web Sockets：基于TCP接口实现双向通信的技术。
Drag and Drop：基于Web的拖拽功能。
Microdata：实现语义网技术，通过自定义Web页面词汇表扩展与实现语义信息。
Audio/Video：原生的音频与视频技术。
Web Workers：基于JavaScript的多线程解决方案。
Web Storage：将信息存储于浏览器本地。于Cookie不同的是，Web Stoage存储的数据更多。
HTML+RDFa：实现语义网的技术。

第二章 HTML5文字和板式变化

2.3 设计段落板式

2.3.1 设置段落样式

<p>...</p> 段落标签

<br>或 <br /> 换行标签 PS：应该没什么区别

2.3.2 设置对齐和缩进

<pre> 可以让文字按原始代码排列
<blockquote> 表示引用文字，会将标签内的文字换行并缩进