面试中经常会被问到HTML5和HTML的区别,那两者的区别究竟体现在哪些方面呢?
1.文档类型声明不同
HTML的文档类型声明很长,一般都是自动生成的,不好记忆:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
HTML5的文档类型声明很短,好记:
<!DOCTYPE html>
2.结构语义不同
HTML没有结构语义化的标签,不能把文档的结构表示的很清楚,比如:我想定义一个网页头部,需要这样写:
<div id="header"></div>
HTML5新增了结构语义化的标签,使文档结构更清晰,更语义化。
HTML5提供了新的语义元素来明确一个Web页面的不同部分,如:
<header> 描述了文档的头部区域
<nav> 定义导航链接的部分
<section> 定义文档中的节(section、区段)
<article> 定义独立的内容
<aside> 定义页面主区域内容之外的内容(比如侧边栏)
<figure> 标签规定独立的流内容(图像、图表、照片、代码等等)
<figcaption> 标签定义 <figure> 元素的标题
<footer> 元素描述了文档的底部区域
3.HTML5新增了一些元素
1)HTML5新增<audio>
和 <video>
标签,这两个标签是用来播放音频和视频的。
2)新增canvas
标签定义图形,比如图表和其他图像。该标签基于 JavaScript 的绘图 API。
3)新增input元素类型:email、url、number、range(滑条)
4.HTML5废除了一些元素
HTML5废除了basefont、font、center、big
不再使用frame框架:frameset、frame等
5.HTML5的优势
1)实时更新(发布版本时,可以直接浏览到最新的的版本,不需要像app一样发布版本需要审核)
2)离线缓存(将网页缓存下来,在无网络的时候也可以访问)
3)跨平台(可同时在PC端、移动端,pad端浏览)
4)视频和音频支持