02_HTML概述

HTML概述

网页的组成

前端三层：HTML(结构层)、CSS(样式层)、JavaScript(行为层)

互联网原理

服务器：一种特殊的计算机，也包括处理器、硬盘、内存、系统总线等，由于需要可靠的服务，在处理能力、稳定性、可靠性、安全性等方面要求较高。

云服务器：一种简单高效、安全可靠、处理能力可弹性伸缩的计算服务。管理方式比物理服务器简单高效。用户无需购买硬件，即可迅速创建或释放任意多台云服务器。

客户端

• 客户端，也叫用户端，指的是普通用户用的终端，客户端形式多样，比如浏览器、app等，而web开发主要的客户端形式是浏览器。
• 浏览器，用户上网搜索、查看资源的应用程序。
  • 功能：发送HTTP请求到服务器，就收服务器的HTTP响应，渲染HTML页面

主流浏览器

• 浏览器：IE,Chrome,FireFox,Safari,Opera

• 内核:Trident,Gecko,Presto,Webkit

浏览器	内核	说明
IE/Edge	Trident	IE内核
FireFox	Gecko	Firefox内核
Safari	Webkit
Chrome	Webkit—>Blink	统称为Chromium内核或Chrome内核
Opera	Presto—>Webkit—>Blink

HTTP协议

Hypertext Transfer Protocol:超文本传输协议。是客户端浏览器或其他程与WEB服务器之间的应用层通信协议

• HTTP请求
  • request,浏览器根据网址向对应的服务器发起请求
  • 发起请求的方法：输入网址或者点击链接
  • HTML页面解析过程中，会发出多个http请求，包含图片、视频，音频等文件请求。
• HTTP响应
  • 响应：response,服务器根据请求响应一个HTML文件，将HTML传输给客户端，在浏览器进行HTML页面渲染。

HTML概念

纯文本格式（文件小，易于传输）

没有其他任何文本修饰，只保存文本，不保存其他格式设置。

纯文本文件特点

1. 文件只能保存文本，不保存其他格式或费文本内容，有利于传输。
2. 所有的纯文本格式文件，可以通过直接更改扩展名的方式更改保存格式。
3. 纯文本格式文件可以使用任意的纯文本编译器进行查看和编辑。

html、CSS、JS都是纯文本格式文件

富文本格式

与纯文本相对应，最常见的是.rtf文件，内部可以保存文本的样式、图片等。

HTML

• Hypertext Markup Language:超文本标记语言。是用来制作网页的一种标记语言。
• HTML是一种纯文本格式的文件，只能写文字内容，不能添加图片、音频、视频等，但是在网页中可以呈现给用户的效果包含了文字以外的内容，这是HTML语言区别于其他文件的不同之处。

HTML的重要概念

超文本

• 超级文本，用于链接另一个文本或多媒体内容的文本，比如连接到图片、音频、视频程序等。

标记

• 又叫做标签，有特殊的书写规范，写给浏览器的一种语法格式，结合普通的文字信息，实现特定的语义或显示内容。在编译器中可以编辑和查看，在浏览器中不显示。

HTML的功能

• 利用标记给普通的文本添加语义、描述超文本内容，搭建网页的基本结构。

HTML语义化

• HTML文件中，如果没有使用特殊的于一标签，也可以实现网页显示的效果，但利用语义给普通的文字添加了不同的语义，能够让网站的结构划分的更加清晰

语义化页面的优势

• 方便阅读和后期维护
• 便于浏览器或者网络爬虫更好地解析网站内容
• 使用语义化标签有利于SEO搜索引擎优化，提高网站的搜索排名

HTML标签语法

1. 标签名必须写在尖括号<>内部分

2. 标签分为单标签和双标签，双标签必须成对出现

3. 双标签包含开始标签和结束标签，结束标签必须书写关闭符号/，但标签也需要自封闭书写。在HTML5中，单标签可以不写关闭符号。

HTML元素

元素内容

1. 元素可以是纯文本，也可以是其他的HTML元素。这种话元素内容包含其他HTML元素的情况，成为嵌套。
2. 一个HTML元素div的内容可能是多个其他元素，嵌套关系可以是多层的。
3. 单标签不能去添加元素内容，可以称为空元素。

标签级别

• 容器级：标签内部可以存放任意内容，包含容器级标签
• 文本级：标签内部只能存放文字或类似文字的内容，比如存放图片、表单元素等

HTML元素的特性

1. 元素间对空格、换行等形式并不敏感，对浏览器加载的效果没有影响。浏览器只识别开始和结束以及相互之间的嵌套关系
2. 空白折叠现象：元素内容如果是文本，所有文字之间如果有空格、换行、缩进等空白字符，在浏览器中只折叠成一个空格显示

HTML属性规范

1. 书写位置：必须写在开始标签或者单标签内，与标签名之间用空格进行分隔。
2. 属性包含：属性名、属性值。属性名与属性值之间的写法通常称作键值对写法，HTML标签的键值对写法是class=“box”。XHTML要求属性值必须在双引号内部。
3. 部分标签属性可以是多个属性值，所有属性值都必须写在同一个双引号内，值与值之间使用空格分隔。 例：