一、概念
- html: Hyper Text MarkUp Language， 一种标记语言
- 浏览器内核：读取网页内容，进行渲染展示
- chrome：blink 内核
- web标准：结构（html），表现（css），行为（js）
二、标签
1. 基本使用
<!--文档类型声明：代表html的版本： 是html5
必须是 html的第一行-->
<!DOCTYPE html>
<!--文档语言：英文，仅仅进行提示作用-->
<html lang="en">
<head>
<!--文档字符集合-->
<meta charset="UTF-8">
<title>I am title</title>
</head>
<body>
I am body
</body>
</html>
2. 常用标签
# 1. 标题标签: 1-6, 字体逐渐变小
<h1></h1>
# 2. 段落标签
<p></p>
# 3. 换行标签
<br/>
# 4. 加粗
<strong></strong>
<b></b>
# 5. 倾斜
<em></em>
<i></i>
#6. 删除线
<del></del>
<s></s>
# 7. 下划线
<ins></ins>
<u></u>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo02</title>
</head>
<body>
<!--段落标签： paragraph
换行标签：-->
<p>
近日，Asahi Linux 项目团队概述了其在 Apple Silicon/Apple M1 支持 Linux 的最新现状。<br/>
通过该项目团队最新发表的公告显示，他们实现了让触摸板和键盘在 M1 驱动的 MacBook
上工作，以及音频播放工作。同时耳机插孔也有开发补丁，用于在 M1 Pro/Max 启动时获得对 M1 的支持。时下，不论是在最初的 M1 芯片上，还是在最近的 M1 Pro 和 M1 Max SoC 上，他们都取得了良好的进展。随着
Linux 5.16 和 5.17 的推出，2022 年 Asahi Linux 项目团队有望完成更多重大项目，以在苹果 M1 硬件上构建一个可用的日常 Linux 系统。（Phoronix）
</p>
<p>
近日，Asahi Linux 项目团队概述了其在 Apple Silicon/Apple M1 支持 Linux 的最新现状。通过该项目团队最新发表的公告显示，他们实现了让触摸板和键盘在 M1 驱动的 MacBook
上工作，以及音频播放工作。同时耳机插孔也有开发补丁，用于在 M1 Pro/Max 启动时获得对 M1 的支持。时下，不论是在最初的 M1 芯片上，还是在最近的 M1 Pro 和 M1 Max SoC 上，他们都取得了良好的进展。随着
Linux 5.16 和 5.17 的推出，2022 年 Asahi Linux 项目团队有望完成更多重大项目，以在苹果 M1 硬件上构建一个可用的日常 Linux 系统。（Phoronix）
</p>
</body>
</html>
3. 盒子标签
# 一个div独占一行， 多个div是多行
# 多个span横向显示
<div>
nihao
</div>
<span>
nihao
</span>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>nihao</div>
<div>nihao</div>
<span>百度</span>
<span>新浪</span>
<span>搜狐</span>
</body>
</html>
4. 图像标签
- 宽度和高度一般只需要修改一个，另外一个随比例缩放
- 属性之间，没有顺序，用空格分割
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!-- 1. src: 图片路径
2. title: 鼠标移动到图片，显示的文字
3. alt: 图片加载不到的时候，显示的文字
-->
<img src="1.jpg" title="demo" width="800" height="500">
<img src="2.jpg" alt="not find">
</body>
</html>