百战归来再读书，工作这么多年来，虽然写了很多的html代码，但总感觉对html代码掌握的还是不够，总觉得自己懂的只是皮毛，并没有触及到html的核心。当前正好有时间，所以就来复习、总结、再学习一下html。
一、HTML常见元素
| 页面中不可见元素 |
页面中可见元素 |
| meta |
div section article aside header footer |
| title |
p |
| style |
span em strong |
| link |
table thead tbody tr td |
| script |
ul ol li dl dt dd |
| base |
a |
| - |
form input select textarea button |
二、HTML5新增内容
| HTML5新增内容 |
|---|
| 新区块标签 |
| ---- section |
| ----article |
| ----nav |
| ----aside |
| 表单增强 |
| ----日期、时间、搜索 |
| ----表单验证 |
| ----Placeholder自动聚焦 |
三、HTML5新增语意
| HTML5新增语意 |
|---|
| header / footer 头尾 |
| section / article 区域 |
| nav 导航 |
| aside不重要的内容 |
| em / strong 强调 |
| i / icon 图标 |
四、HTML元素的分类
| 按默认样式分 |
|---|
| 块级 block |
| 行内 inline |
| inline-block |
五、HTML元素嵌套关系
块级元素可以包含行内元素
块级元素不一定包含块级元素
p标签不能包含div元素
行内元素一般不能包含块级元素
a标签可以包含div标签，原因是HTML5中按照内容分类了，至于详细的，可以参照下图：
html5元素按内容分类
，更加详细的信息，请查找
HTML5标准。
六、HTML面试真题
问题1、HTML XHTML HTML5的关系
| HTML XHTML HTML5的关系 |
|---|
| HTML属于SGML |
| XHTML属于XML，是HTML进行XML进行严格话的结果 |
| HTML5不属于SGML或XML，比XHTML宽松 |
问题2、HTML5有什么变化
| HTML5有什么变化 |
|---|
| 新的语义化元素 |
| 表单增强 |
| 新的API（离线、音视频、图形、实时通信、本地存储、设备能力） |
| 分类和嵌套变更 |
问题3、em和i有什么区别
| em和i有什么区别 |
|---|
| em是语义化标签，表强调 |
| i是纯样式的标签，表斜体 |
| HTML5中i不推荐使用，一般用作图标 |
问题4、语义化的意义是什么？
| 语义化的意义是什么 |
|---|
| 开发者容易理解 |
| 机器容易理解结构（搜索、读屏软件） |
| 有助于SEO |
| semantic microdata |
问题5、哪些元素可以自闭合？
| 哪些元素可以自闭合 |
|---|
| 表单元素input |
| 图片元素img |
| br hr |
| meta link |
问题6、HTML和DOM的关系？
| HTML和DOM的关系 |
|---|
| HTML是“死”的 |
| DOM由HTML解析而来，是“活”的 |
| js可以维护DOM |
问题7、property和attribute的区别？
| property和attribute的区别 |
|---|
| attribute 是“死”的 |
| property 是“活”的 |
问题8、form的作用有哪些？
| form的作用有哪些 |
|---|
| 直接提交表单 |
| 使用submit / reset 按钮 |
| 便于浏览器保存表单 |
| 第三方库可以整体提取值（表单序列化） |
| 第三方库可以进行表单验证 |
网友评论