标签：HTML -- 标签初识 html 文档页面

HTML初识

HTML的概念

html是超文本标记语言，全称是HyperText Markup Language。它不是一种编程语言，是一种描述性的标记语言

作用：HTML是负责描述文档语义的语言

概念：超文本

两层含义：1、文本理解就是文字，超出文字的比如图片、视频、动画等。2、可以通过链接跳转页面

概念：标记语言

百度中的解释是，标记语言是一种将文本以及文本相关的其他信息结合起来，展现出关于文档结构和数据处理细节的电脑文字编码。与文本相关的其他信息（包括文本的结构和表示信息等）与原来的文本结合在一起，但是使用标记进行标识。

其中使用标记进行标识，可以理解为标签，譬如<a>标识超链接，属于HTML标签。通过浏览器解析执行就可以给用户展示

HTML是负责描述文档语义的语言

数据本身没有任何意义，只有被赋予含义的数据才能够被使用，这时候数据就转化为了信息，而数据的含义就是语义。

也就是原本的文字没有什么意义，但是通过标签即HTML语言可以转变成例如超链接，变得更有意义。

面试中标签的作用可以说是给文档增加语义。

HTML的专有名词

网页：各种标签组成的页面
主页（首页）：一个网站的起始网页或导航页面
标记：分为开始标记和结束标记，也称为标签，每个标签都有特定的含义，例如含义是段落
元素：标签+标签内容组成一体就是元素，比如这是段落
属性：给每个标签所做的辅助信息，通常在开始标签内的设置
XHTML：eXtensible X，符合XML语法标准的HTML
DHTML：dynamic，动态的。javascript + css + html合起来的页面就是一个 DHTML。
HTTP：超文本传输协议，打开网站的网址开头，客户端和服务端交互的协议。SMTP:邮件传输协议，应用层协议。FTP：文件传输协议

书写第一个HTML页面

工具是vs code，创建一个.html的文件，输入html:5，再按tab就可以出现如下页面：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

</body>
</html>

这个就是html页面的骨架，添加标签就可以实现各种功能，标签添加在body标签内。

HTML结构详解

HTML的标签大部分都是成对出现的，如.也有单个标签，如 .

属性和标记之间以及个属性之间用空格隔开。属性值用双引号括起来，如<img src=""`/>

html骨架标签详情

<html></html>，HTML标签，页面中的最大的标签，可以称为根标签
<head></head>,文档的头部，在此标签内设置的标签是title，这个标签内容就是删除浏览器的页面时旁边的展示
<title></title>,文档标题，就是网页最上面的展示
<body></body>,文档主体，写标签就是在这个里面

html拆解

文档声明头即 DocType Declaration，简称DTD。就是语句<!DOCTYPE ...>，用来告知浏览器文档使用那种HTML或XHTML规范
```
<!DOCTYPE html>
```
页面语言lang，指定页面的语言类型。常见的有两种，en---指定页面语言为英语，zh-CN--指定页面语言为中文

<html lang="en">

头标签，内部是页面的配置，如字符集、关键字、页面描述、页面标题等

常见标签：
- <title>:指定网页标题，在浏览器最上面显示
- <base>：为页面上所有链接规定的默认地址或默认目标
- <meta>：提供有关页面的基本信息
- <body>：主体标签，写的标签放在次标签内。定义Html文档所需要显示的内容
- <link>：定义文档和外部资源的关系

base标签：

<base href="/">

用来指定<a>链接的基础路径

body标签：

<body link="blue" alink="red" vlink="green">

属性：

--bgcolor：设置整个网页的背景颜色

--background：设置整个网页的背景图片

--text：设置网页中文本的颜色

--leftmargin：网页的左边距。IE默认8个像素

--topmargin：网页的上边距

--rightmargin：网页右边距

--bottommargin：网页下边距

--link：链接的默认颜色

--alink：鼠标点击未松开的颜色

--vlink：鼠标点击后的颜色

meta标签：

字符集：

Character set是多个字符的集合，就是网页的编码方式。计算机要准确的处理各种字符集文字，需要进行字符编码，以便计算机能够识别和存储各种文字。

字符集必须有，要不然可能会出现乱码。

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

常见字符集：ASCII码、ANSI编码、GBK、Unicode编码（统一编码）、UTF-8编码。

视口viewport：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

width=device-width:表示视口宽度等于屏幕宽度

暂时不懂

定义“关键字”：

<meta name="Keywords" content="网易,邮箱,游戏,新闻,体育,娱乐,女性,亚运,论坛,短信" />

就是用户搜索时候，输入的关键字。告诉搜索引擎这个页面与什么有关，用户好搜索

定义“页面描述”：

<meta name="Description" content="网易是中国领先的互联网技术公司，为用户提供免费邮箱、游戏、搜索引擎服务，开设新闻、娱乐、体育等30多个内容频道，及博客、视频、论坛等互动交流，网聚人的力量。" />

就是打开网页时，用户搜索完后，出现结果中，除了链接外，那一大段描述语句

跳转页面：

<meta http-equiv="refresh" content="3;http://www.baidu.com">

3秒后跳转到百度，很常见。

HTML规范

不区分大小写，但大部分建议小写
后缀名为html或htm
XHTML规范：嵌套要合适（<h1></h1>）、标签小写且闭合（双标签一起出现单标签建议写成 带斜杠的）、属性必须用引号、属性必须赋值、文档开头必须有DTD文档对类型
html对换行和tab不感兴趣，主要在标签内就可以，且多个空格换行tab被折叠成一个空格

标签：HTML,--,标签,初识,html,文档,页面
From： https://www.cnblogs.com/KindaZhang/p/18283868

初识html