HTML 初识

1. 定义

HTML 指的是超文本标记语言是用来描述网页的一种语言。
HTML 不是一种编程语言而是一种标记语言
标记语言是一套标记标签
所谓超文本，有2层含义：

因为他可以加入图片、声音、动画、多媒体等内容（超越文本限制）
不仅如此，它还可以从一个文件跳到另一个文件，与世界各地主机的文件连接（超级链接文本）

总结

html 是超文本标记（标签）语言
我们学习html主要学习html标签
我们用html标签描述网页元素。比如图片标签、文字标签、链接标签等等
标签有自己的语法规范，所有的html标签都是用<>表示的

1.1 HTML骨架标签

语法规范
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>

标签名	定义	说明
<html></heml>	HTML标签	页面中最大的标签，我们成为根标签
<head></head>	文档的头部	注意在head标签中我们必须要设置的标签是title
<title></title>	文档的标题	让页面拥有一个属于自己的网页标题
<body></body>	文档的主题	元素包含文档的所有内容，页面内容基本都是放到body里面的

例

        <head>
    <title>00我的页面00</title>
        </head> 
        <body>
            窗前明月光，疑是地上霜。
        </body> 
</html>

结构

1.2HTML元素标签分类

标签：

带<>符号的的元素被称为HTML标签。

分类：

常规元素（双标签）
<标签名>内容</标签名> 比如<body> 我是神</body>

2.空标签（单标签）
<标签名 /> 比如<br />

1.3 HTML标签关系

主要针对于双标签的相互关系分为两种：请大家务必熟悉记住这种标签关系。
，因为后面我们标签嵌套不叫多，很容易弄混他们的关系。

嵌套关系

<head>
      <body>
      </body>
</head>

并列关系

<head> </head>
<body> </body>

2. 代码开发工具

sublime生成html骨架小技巧

双击打开软件
新建文件（ctrl+n）
保存（ctrl+s）,保存为：文件名.html （注意后缀名必须是 .html )
放大缩小代码按住 ctrl 在滚动鼠标滚轮或者 ctrl+ 加号键和 ctrl + 减号键
生成页面骨架结构
- html: 5 按下tab键或者
- ! 按下tab键
在浏览器中预览页面
- 右键在浏览器中打开

3. 文档类型<!DOCTYPE>

用法：

<!DOCTYPE html>

作用：

<!DOCTYPE> 声明位于文档中的最前面的位置，处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。

HTML文件必须加上 DOCTYPE 声明，并统一使用 HTML5 的文档声明

4. 页面语言lang

<html lang="en">  指定html 语言种类

最常见的2个：

en定义语言为英语
zh-CN定义语言为中文

<html lang="zh-CN"> 指定该html标签内容所用的语言为中文

考虑浏览器和操作系统的兼容性，目前仍然使用 zh-CN 属性值

简单来说，可能对于程序来说没有太大的作用，但是它可以告诉浏览器，搜索引擎，一些处理Html的程序对页面语言内容来做一些对应的处理或者事情。
比如可以

根据根据lang属性来设定不同语言的css样式，或者字体
告诉搜索引擎做精确的识别
让语法检查程序做语言识别
帮助翻译工具做识别
帮助网页阅读程序做识别
等等

5. 字符集

<meta charset="UTF-8" />

字符集(Character set)是多个字符的集合。

计算机要准确的处理各种字符集文字，需要进行字符编码，以便计算机能够识别和存储各种文字。

utf-8是目前最常用的字符集编码方式，常用的字符集编码方式还有gbk和gb2312。

gb2312 简单中文包括6763个汉字 GUO BIAO
BIG5 繁体中文港澳台等用
GBK包含全部中文字符是GB2312的扩展，加入对繁体字的支持，兼容GB2312
UTF-8则基本包含全世界所有国家需要用到的字符
这句代码非常关键，是必须要写的代码，否则可能引起乱码的情况。

这句话是让 html 文件是以 UTF-8 编码保存的，浏览器根据编码去解码对应的html内容。

一般情况下统一使用 "UTF-8" 编码, 请尽量统一写成标准的 "UTF-8"，不要写成 "utf-8" 或 "utf8" 或 "UTF8"。

6. HTML标签的语义化

白话：所谓标签语义化，就是指标签的含义。

语义化目的:

根据标签的语义，在合适的地方给一个最为合理的标签，让结构更清晰。

方便代码的阅读和维护
同时让浏览器或是网络爬虫可以很好地解析，从而更好分析其中的内容
使用语义化标签会具有更好地搜索引擎优化

语义是否良好：当我们去掉CSS之后，网页结构依然组织有序，并且有良好的可读性。( 裸奔起来一样好看 )

遵循的原则：先确定语义的HTML ，再选合适的CSS。所以，我们接下来学习html标签，要根据语义去记忆。 HTML网页中任何元素的实现都要依靠HTML标签。

HTML初识