萌新告诉你什么是HTML5
1、HTML和XHTML是什么？
HTML，全称“HyperText Mark-up Language（超文本标记语言）”，它是构成网页文档的主要语言。我们常说的HTML，指的是HTML4.01。
XHTML，全称“EXtensible HyperText Mark-up Language（扩展的超文本标记语言）”，它是XML风格的HTML4.01，我们可以称之为更严格、更纯净的HTML4.01。
HTML语法书写比较松散，比较利于开发者编写。但是对于机器如电脑、手机等来说，语法越松散，处理起来越困难。因此，为了让机器更好地处理HTML，才在HTML的基础上引入了XHTML。XHTML相对于HTML来说，在语法上更加严格。
2、XHTML和HTML的主要区别有哪些？
2.1、XHTML标签必须被关闭
在XHTML中，所有标签必须被关闭，如<p></p>、<div></div>等。此外，空标签也需要闭合，例如<br>要写成<br/>。
错误写法：
<p>Hello World!!!
正确写法：
<p>Hello World!!!</p>
2.2、XHTML标签以及属性必须小写
在XHTML中，所有标签以及标签属性必须小写，不能大小写混用，也不能全部都是大写。标签的属性值可以大写，但是我们依然建议全部采用小写。
错误写法：
<Body><DIV></DIV></Body>
正确写法：
<body><div></div></body>
2.3、XHTML标签属性必须用引号
在XHTML中，标签属性值必须用引号括起来，单引号、双引号都可以。
错误写法：
<input id=txt type=text/>
正确写法：
<input id="txt" type="text"/>
2.4、XHTML标签用id属性代替name属性
在XHTML中，除了表单元素之外的所有元素，都应该用id而不是name。
错误写法：
<div name="wrapper"></div>
正确写法：
<div id="wrapper"></div>
完整的XHTML文档样式如下：
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Sample Page</title>
</head>
<body>
<h1>我是一级标题</h1>
<h2>我是二级标题</h2>
</body>
</html>
3、HTML5是什么？
HTML指的是HTML4.01，XHTML是XML风格的HTML4.01，它是HTML的过渡版本。HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准，也就是HTML4.01的升级版，是构建以及呈现互联网内容的一种语言方式，被认为是互联网的核心技术之一。单纯从新增的标签上来看，HTML5有以下几个特点：
3.1、文档类型简写
基于HTML5设计准则中的“化繁为简”原则，页面的文档类型<!DOCTYPE>被极大地简化了。
XHTML文档声明如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
在HTML5中可以简写为：
<!DOCTYPE html>
3.2、字符编码简写
XHTML字符编码如下：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
在HTML5中可以简写为：
<meta charset="UTF-8">
3.3、标签不再区分大小写
下面这种写法是完全符合HTML5规范的。但是在实际开发中，建议所有标签以及属性都采用小写方式。
<div>Hello World!!!</DIV>
3.4、允许属性值不加引号
下面这种写法是完全符合HTML5规范的。但是在实际开发中，建议标签所有属性值都加引号，单引号或双引号都可以。
<div id=wrapper style=color:red>Hello World!!!</div>
3.5、允许部分属性的属性值省略
在HTML5中，部分具有特殊性属性的属性值是可以省略的。例如，下面代码是完全符合HTML5规范的：
<input type="text" readonly/>
<input type="button" disabled/>
上面两句代码等价于：
<input type="text" readonly="readonly"/>
<input type="button" disabled="disabled"/>
在HTML5中，可以省略属性值的属性如下表所示：
| 省略形式 | 等价于 |
|---|---|
| autofocus | autofocus=“autofocus” |
| async | async=“async” |
| checked | checked=“checked” |
| defer | defer=“defer” |
| disabled | disabled=“disabled” |
| download | download=“download” |
| hidden | hidden=“hidden” |
| ismap | ismap=“ismap” |
| multiple | multiple=“multiple” |
| nohref | nohref=“nohref” |
| noresize | noresize=“noresize” |
| noshade | noshade=“noshade” |
| novalidate | novalidate=“novalidate” |
| nowrap | nowrap=“nowrap” |
| required | required=“required” |
| readonly | readonly=“readonly” |
| selected | selected=“selected” |
完整的XHTML5文档样式如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Sample Page</title>
</head>
<body>
<h1>我是一级标题</h1>
<h2>我是二级标题</h2>
</body>
</html>
- 点赞
- 收藏
- 关注作者
评论（0）