一. HTML5 与 XHTML区别
HTML4.01 -> HTML5( 功能强大 )
XHTML : XML + HTML ( 严格版本的HTML )
发展 XHTML2.0
区别:
DOCTYPE文档及编码
HTML5 : <!DOCTYPE html>
XHTML和HTML4.01 : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
HTML5 : <meta charset="UTF-8">
XHTML和HTML4.01 : <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
元素大小写
HTML5 和 HTML4.01 : 不区分大小写的,建议都写成小写(规范)
<div></div> <span></span>
<DIV></DIV> <SPAN></SPAN>
XHTML : 要求必须小写。
属性布尔值
HTML5和 HTML4.01 : 当属性和属性值相同的时候,可以只写一个
<input type="checkbox" checked>
XHTML : <input type="checkbox" checked="checked">
属性引号
HTML5和 HTML4.01 : 属性值是可以不加引号的,但是建议添加(规范)
<input type=checkbox>
XHTML : <input type="checkbox">
图片的alt属性
HTML5和 HTML4.01 : 图片的时候alt属性可加可不加。
<img src="">
XHTML : <img src="" alt="">
单标签写法
HTML5和 HTML4.01 :
<img src="">
<input type="">
XHTML :
<img src="" />
<input type="" />
双标签闭合
HTML5和 HTML4.01 :
<div>这是一个盒子 (不建议)
XHTML : 双标签必须成对
<div>这是一个盒子</div>
二. HTML5新语义化标签
div span h1 img -> html4.01
width height background -> css2.1
transform border-radius -> css3
header footer main -> html5
注:很多新的HTML5语义化标签,跟div类似。
header : 页眉
footer : 页脚
main : 主体
注:header footer main 语义化标签在一个页面中只能出现一次。
hgroup : 标题组合
nav : 导航
article : 独立的内容
论坛帖子
报纸文章
博客条目
用户评论
aside : 辅助信息的内容
section : 区域 , 跟div的功能以及语义是一样的
figure : 描述图像或视频
figcaption : 描述图像或视频的标题部分