1.html语义化的作用
- 更容易让屏幕阅读器读出网页内容
- 更容易让搜索引擎收录
2.HTML声明
<!DOCTYPE>声明帮助浏览器正确的显示网页
- <!DOCTYPE>不是HTML标签
- <!DOCTYPE>必须放在HTML的第一行
例如：<!DOCTYPE html>3.HTML乱码解决
当网页出现乱码时，在<head></head>标签之间添加<meta charset="utf-8" />为什么网页会出现乱码？
html文件编码和浏览器编码不一致。
4.常用标签
- 段落标签
<p>段落文本</p>
浏览器会自动的在段落的前后添加空行。（<p>是块级元素）- 标题标签
<hx>标题</hx>
<h1>~<h6>,浏览器会自动的在标题的前后添加空行。
请确保将 HTML 标题标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用标题。- 强调标签
<strong>加粗</strong>
<em>斜体</em>- 引用标签
<q>引用标签</q>
不用添加双引号，浏览器会自动添加。
<blockquote>引用文本</blockquote>
会自动缩进。- 换行
<br/>
<br/> 元素是一个空的 HTML 元素。由于关闭标签没有任何意义，因此它没有结束标签。- 水平线
<hr> 标签在 HTML 页面中创建水平线。
hr 元素可用于分隔内容，使用该元素产生的水平线可以在视觉上将文档分隔成各个部分。- 注释
<!-- 这是一个注释 -->- 行内标签
<span>内容</span>
没语义，作用是为了防止单独样式，把一段话圈起来，然后用css设置样式。- 空格符
- 地址
<address></address>- 代码语言
<code>一行代码</code>
<pre>多行代码</pre>，元素中的文本会保留空格和换行符，网页预显示格式- 链接
-<a href="http://www.baidu.com">这是一个链接</a>
HTML 链接是通过标签 <a> 来定义的.a标签，也叫anchor（锚点）元素，既可以用来链接到外部地址实现页面跳转功能，
也可以链接到当前页面的某部分实现内部导航功能。
-<a href="#">链接文字</a>，其中“ # ”表示空链接。
鼠标指向空链接后，鼠标变成手形，但单击后仍停留在当前页面。
-HTML 链接 - target 属性
使用 Target 属性，你可以定义被链接的文档在何处显示（在新的出口打开，还是在原有的窗口中打开）。
<a href="//www.baidu.com" target="_blank">访问百度官网首页</a>
提示：默认的被链接文档会在原有的窗口中打开的。如果将 target 属性设置为 "_blank" 则文档就会在新窗口打开。
-HTML 链接 - id 属性
id 属性可用于在一个 HTML 文档中创建书签标记。
提示: 书签是不以任何特殊的方式显示，在HTML文档中是不显示的，所以对于读者来说是隐藏的。- 图像
HTML 图像是通过标签 <img> 来定义的。使用img元素来为你的网站添加图片，使用src属性指向一个图片的具体地址。
举例如下：<img src="https://www.your-image-source.com/your-image.jpg">
请注意：img元素是自关闭元素，不需要结束标记。- 无序列表
<ul>
<li> </li>
<li> </li>
<li> </li>
</ul>- 有序列表
<dl>
<li> </li>
<li> </li>
<li> </li>
</dl>5.文本格式化
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>W3Cschool教程(w3cschool.cn)</title>
</head>
<body>
<b>加粗文本</b><br><br>
<i>斜体文本</i><br><br>
<code>电脑自动输出</code><br><br>
这是 <sub> 下标</sub> 和 <sup> 上标</sup>
</body>
</html>
6.示例
<!DOCTYPE html>
<html>
<head>
<title>春晓</title>
</head>
<body>
<h2>春晓</h2>
<p>
<strong>春眠不觉晓</strong>
</p>
<p>
<strong>处处闻啼鸟</strong>
</p>
<p>
<strong>夜来风雨声</strong>
</p>
<p>
<strong>花落知多少</strong>
</p>
</body>
</html>