HTML学习笔记

一、HTML简介

1.HTML是什么？
HTML:Hyper Text Markup Language超文本标记（标签）语言
由多种标签组成，用来制作网页，告浏览器该如何显示页面

3.锚链接

3.1简介

点击链接后跳转到某一个页面的指定位置(锚点anchor)

• 锚链接的分类：

​ . 页面内的锚链接

​ .页面间的锚链接

3.2页面间的锚链接

步骤：

1.定义锚点(标记)

<a name="锚点的名称"></a>

2.锚点链接

<a href="#锚点名称">链接文本</a>

3.3页面间的锚点链接

<a href="目标网页的文件名#锚点名称"></a>

4.功能链接

5.URL

5.1简介

URL:Uniform Resource Locator统一资源定位器，用来定位资源所在的位置，最常见的就是网址

https://www.baidu.com/img/bd_logo1.png?name=tom&age=2&sex=male https://www.w3school.com.cn/html/html_quotation_elements.asp file:///C:/Users/Administrator/Desktop/project/code/09.%E5%B8%B8%E7%94%A8%E6%A0%87%E7%A D%BE3.html http://www.sxgjpx.net/ ftp://10.255.254.253/ 

5.2组成

https://www.w3school.com.cn/html5/index.asp http://www.sxgjpx.net/ file:///C:/Users/Administrator/Desktop/project/code/18.%E5%8A%9F%E8%83%BD%E9%93%BE%E6%8 E%A5.html ftp://10.255.254.253/ https://www.baidu.com/img/bd_logo1.png 1 11234

• 协议：prococol如

  http:超文本传输协议，用来访问WEB网站Hyper text Transfer protocol

  http:更加安全的协议SSL安全套接子层

  ftp文件传输协议，用来访问服务器上的文件，实现文件的上传和下载File Transfer protocol

  file：文件协议，用来访问本地文件

• 主机名hostname服务器地址或服务器Netbios名称，如www.baidu.comf ftp://10.255.254.254

• 端口：port位于主机名的后面，使用冒号进行分隔

  不同的协议使用不同的端口，如http使用80端口，https使用的443端口，ftp使用20和21

  如果使用的是默认端口，则端口可以省略

  如果使用的不是默认端口，则必须指定端口http://59.49.32.213:7070/

• 路径：path目标文件所在的路径结构，如：www.baidu.com/img/

• 资源resource要访问的目标文件，如bd_logo1.png

• 查询字符串：query string也称为参数

  在资源后面使用？开头的一组名称/值

  名称和值之间以=分隔，多个表达方式之间用&分隔，如:name=tom&age=2&sex=male

• 锚点anchor，在资源后面使用#开头的文本，如#6

• 身份认证authentication，指定身份信息，如:ftp://账户:密码@ftp.bbshh010.com
  2.HTML语言的作用？
  制作网页，控制网页和内容的显示
  插入图片、音乐、视频、动画等多媒体
  通过链接检索信息
  使用表单获取用户信息，实现交互
  3.版本
  W3C:World wide web consortium万维网联盟，制定WEB技术相关标准和规范的组织，HTML就是由W3C制定的
  标准
  两个版本:HTML4.0和HTML5.0
  官网：https://www.w3school.com.cn/
  4.HTML后缀名----扩展名
  HTML文件的扩展名 是以.html或.htm来结尾

二、HTML文档的结构

1.基本结构
1.1 简介
HTML标签是由尖括号括起来的关键，如 ,通常都是成对出现的，如
以 为根标签，包含： 头部和 主体部分
头部提供关于网页的相关信息，如标题、字符编码、文档类型、关键等摘要信息
主体部分提供网页的具体内容，真正显示在页面中
合理的进行缩进
标签名不区分大小写，但一般习惯用小写
1.2开发工具
记事本notepad sublime notepad++ Dreamweaver VScode Webstorm等使用步骤：

新建文件(ctrl+N),然后保存(ctrl+S),指定扩展名为.hmtl (否则代码无颜色提示)
编写HTML文件
在浏览器中打开文件
使用技巧：

先保存在编写代码，否则没有颜色提示

.建议创建一个文件夹，用于保存所有的网页内容，将文件夹拖拽到sublime中打开，便于管理
显示/隐藏侧边栏
方式1：查看–>侧边栏–>显示/隐藏侧边栏
方式2：ctrl+k再按B
.显示多栏
方式1：查看–>布局–>列数2列
方式2：ali+shift+2

1.3浏览器
常见浏览器：IE浏览器 Chrome谷歌 ，firefox火狐，safair苹果
浏览器的作用就是来读取html文件，并以网页的形式进行显示
浏览器不会直接显示html 标签，而是使用标签来解释网页的内容。2.标签
2.1标签的组成

一个完整的html标签的组成：

<标签名 属性名=“属性值”>内容</标签名>

属性值要用引号引起来，一般用双引号

2.2标签的分类

根据标签是否关闭，分为：关闭型、非关闭型

• 关闭型标签：有开始标签也有结束标签，即标签成对出现

```html ```html

• 非关闭标签：只有开始标签，没有结束标签
  

根据