图文教程
html常用标签
常用标签
1. 文档结构
- <!DOCTYPE html>：声明HTML文档类型。
- <html>：定义HTML文档的根元素。
- <head>：定义文档头部，包含元数据。
- <title>：设置网页标题，浏览器标签页显示。
- <body>：定义网页的主体内容。
2. 文本格式化
**1.<h1> ~ <h6>：**定义标题，<h1>是最高级，<h6>是最低级。
-注意：标题系列标签有助于浏览器搜索的优化，搜索引擎抓取标题的内容 ，h1标签的权重最大，但一个页面只能使用一个h1标签 ，如果使用多个h1标签那么搜索优先级会降低
**2.<p>：**定义段落。
**3.<br>：**换行。
**4.<strong>：**加粗文本，语义上表示强调。
**5.<em>：**斜体文本，语义上表示强调。
**6.<b>：**加粗文本（只是样式，语义不如<strong>）。
**7.<i>：**斜体文本（只是样式，语义不如<em>）。
**8.<u>：**下划线文本。
3. 链接与图片
- <a>：定义超链接。
- <img>：插入图片，需设置 src 属性指向图片地址。
格式： <img src="hello/ma.jpg" alt="">
**-src属性：**图片源；
**-alt属性：**图片替换文本（当图片不显示的时候会显示我们写上去的文本）
注意：hello文件和ma.jpg要放在此源代码文件夹下才会显示出来
<img src="images/1.jpg" title="鸟巢的远景">
其中title属性的作用是设置鼠标悬在图片上时看到的文本
- <link>：连接外部资源，通常用于外部样式表。
- <meta>：定义网页的元数据，如字符集、描述、关键字等。
4. 列表
- <ul>：无序列表。
- <ol>：有序列表。
- <li>：列表项。
- <dl>：定义定义列表。
- <dt>：定义定义列表项的标题。
- <dd>：定义定义列表项的描述。
5. 表格
- <table>：定义表格。
- <tr>：定义表格的行。
- <td>：定义表格的单元格。
- <th>：定义表格头部单元格，通常为加粗居中的文本。
- <caption>：定义表格的标题。
相对路径和绝对路径
（还是以上边的图片嵌入为例）
**--相对路径：**从当前文件或目录的位置出发，指定目标文件或目录的路径。
**--绝对路径：**从文件系统的根目录开始，完整指定文件或目录的位置路径。
比如相对hello文件夹（文件路径为F:\hello），ma.jpg的相对路径为hello/ma.jpg，ma.jpg的绝对路径为F:\hello\ma.jpg
**--html源代码文件：**就是包括这行代码的源代码文件
锚点
锚点：HTML中的一种标记，用于在同一页面内或不同页面之间创建可跳转的链接位置。
<a></a>（在指定位置添加一个超级链接）；需要注意的是锚点中的锚和点的使用方法不同，后面会做出详细讲解。
--a标签的几个属性：
1.href：可以跳转链接；也可以跳转html文件
2.target属性（要搭配_blank关键词）：是否在新标签页打开链接（点击链接后会打开一个新标签页然后加载内容）
【页面内跳转锚点的设置有两种方法】
关于页面内锚点的概述：如下图所示，就是我们看一些网页上面的索引
++【方法一】++：通过设置标签a的name属性达到页面跳转锚点的方法
锚 ，href属性，后面一定要加#号
<a href="#jbxx">基本信息</a>
锚点的点，name属性设置成跳转的链接
<a name="jbxx"></a>
++【方法二】++：设置锚点的点为标签的id属性
锚
<a href="#jbxx">基本信息</a>
锚点的点 ：由原来的a标签的name属性变为了其他标签id属性，使用方法跟href一致
<h3 id="jbxx">基本信息</h3>
这种方法是直接在我们的<h3>标签标题中直接引入id属性（id属性适配所有html标签）
视频教程
哔哩哔哩（B站）搜索框中输入"uid=3546393096489381"即可
用户：star010_