知识介绍

HTML介绍

HTML（Hyper Text Markup Language），中文意思是超文本标记语言。
超文本：超越了普通的文本，网页有文字，有超链接，甚至有图片、音频和视频等。
标记：我们通常使用一对对的标签，来对网页内容进行标记。
语言：是一种体系，html语言是用各种各样的标签组成，描述着网页的视频，音乐和链接等超文本内容。

HTML发展史

W3C管理和维护HTML标准，1993年推HTML1.0，1999年推HTML4.01，2000年推XHTML1.0，还有夭折的XHTML2.0；2005年另外的组织WHATWG推出HTML5草案，2008年，W3C和WHATWG合并，2014年，HTML5定稿推出。

故事：W3C是用于维护和制定html标准的组织，在1999年推出HTML4.01之后觉得HTML已经不必要再维护下去，开始主推XHTML，可是浏览器厂商（如微软、苹果等公司）并不买账，开发者和以前编写的网页也无法适应XHTML。这种情况下，WHATWG（浏览器厂商联合起来的组织）提出HTML5草案抛开W3C自己玩，W3C在XHTML时代发现没人和他玩，只好找WHATWG谈判，于是两派合并，最后于2014年正式推出HTML标准。

HTML5是向上兼容的，他既支持以前的宽松的HTML4.01书写方式，也支持严格的XHTML格式，同时它还有很多新的特性。

 

 
  
  
  
  HTML第一课
 
 
  html介绍

代码介绍

doctype html描述的是文档类型

doctype必须放在文档的第一行。这句话的作用是，告诉浏览器，用标准模式进行解析，因为浏览器对页面的渲染有两种模式，一种是怪异模式（浏览器使用自己的模式解析渲染页面），还有一种是标准模式（浏览器使用W3C官方标准解析渲染页面）。doctype是不区分大小写的。

文档开始。

标签是该网页总所有标签的顶层标签，用于表示HTML文档的开始。lang="en"是标签的属性，表示文档语言是英文。

设置网页文档的头部信息

主要用来设置一些与网页相关的信息，与网页标题，网页字符集，网页的描述关键词等等，设置的信息一般不会显示在浏览器窗口中，主要是给浏览器看的，通常不是给用户看的。

网页文档的标题。

标签的作用有两个一是设置网页的标题，会显示在浏览器的标签栏当中，告诉浏览者网页的主题是什么。二是用于搜索引擎索引，作为搜索关键字以及搜索结果的标题使用。特别提醒，搜索引擎会根据title标签设置的内容，将网站或文章进行归类。所以一个好的标题，可以使网站获得更好的搜索排名。</p> <pre><code><title>百度一下，你就知道

定义文档元数据。

标签位于文档的头部。元数据，就是用来描述数据的数据，在这里也就是用它来对网页的特性进行描述。比如文档字符集，关键字，网页描述信息等等。

使用设置页面字符集.

可以设置页面内容所使用的字符编码，浏览器会根据此处的字符编码，来调用相应的字符编码来显示页面内容和标题.
网页有时会出现乱码。出现乱码的原因是里面设置的字符编码和文件保存的字符编码不一致。
为避免出现乱码，推荐大家使用万国码“utf-8”，并且对应在保存的时候，设置文件的编码格式为utf-8。
万国码的好处是，可以的在网页当中显示各个国家的各种文字和字符。如果你确认只需要显示中文和英文，那么，也可以设置字符集为GBK。比如百度使用的是万国码，网易用的是GBK。

使用设置关键字

网页关键字，是为了方便搜索引擎搜索而设置的，用户在网页中是看不到的，它的主要作用是用于搜索引擎优化，可以有多个关键字,关键字之间用空格或者英文逗号隔开，需要注意的是，设定多个关键字，可以提高被搜索到的几率，但是大多数的搜索引擎在检索时，都会限制关键词的数量，一般10个以内比较合理.

使用设置网页描述信息

网页的描述信息，主要用于描述网页的主要内容.是对关键词的补充性描述，并且会作为搜索结果返回给用户。同时，像关键字一样，搜索引擎对描述信息的字数也有限制，一般不超过100个，所以描述信息的内容，也应尽量简明扼要。
下图红色箭头指向的是百度搜索引擎返回网易首页的描述信息。

image.png

页面主体内容

代表了页面的主体部分，用于放置页面内容，按照html标准，需要在浏览器窗口中显示的内容，都必须放在标签之间。不过需要提醒的是，html是一个很宽松的标准，你即使把内容放在之外，也能正常显示，但是不符合标准。

总结

上面讲的是html的介绍和基本结构标签的含义和使用，我们可以总结出:

html是由标签组成
标签，是由尖括号包围起来的有一定作用和意义的关键词，如 .
标签通常是成对出现的，称为双标签，有开始和结束标签。内容放在开始标签和结束标签之间，即开始标签和结束标签标明该标签的作用范围.
少量标签是单标签，只有开头没有结尾，什么时候使用单标签呢？不需要指定标签作用范围的时候。
标签的属性，标签通常含有若干个属性，每个属性的格式是：属姓名="属性值"。中，meta是标签，它有两个属性，属性名分别是name和content。属性之间用空格隔开。

测试

小组讨论或自问自答每行代码含义和作用。


 
  HTML第一课
 
 
  html练习：01-a

练习

请大家打开记事本，在记事本中输入下列代码，保存为01-a.html和01-b.html，保存时字符集选择UTF-8。