HTML详解连载（2）

HTML详解连载（2）

下面进行专栏介绍

本专栏是自己学前端的征程，纯手敲的代码，自己跟着黑马课程学习的，并加入一些自己的理解，对代码和笔记 进行适当修改。希望能对大家能有所帮助，同时也是请大家对我进行监督，对我写的代码进行建议，互相学习。

开始喽

在这里插入图片描述

超链接

作用

点击跳转到其他页面。

代码示例

  <a href=”https://www.baidu.com”>跳转到百度</a>

解释

href属性值是跳转地址，是超链接的必须属性。
属性加上target=”_black”新窗口打开页面

经验分享

开发初期，不知道超链接的跳转地址。href属性写#，表示空链接，不会跳转。

音频标签

代码示例

	<audio src=”音频的URL”></audio>

注意

强调

在HTML5中，如果属性名和属性值完全一样，可以简写为一个单词

在这里插入图片描述

视频标签

代码示例

<video src=”视频的URL”></video>

注意

强调

在浏览器中，想要自动播放，必须有muted属性

列表

作用：布局内容排列整齐的区域。

分类：无序列表，有序列表，定义列表

无序列表

作用

布局排列整齐的不需要规定顺序的区域

标签

ul嵌套li，ul是无序列表，li是列表条目

示例

<ul>
  <li>第一项</li>
  <li>第二项</li>
  <li>第三项</li>
  ……
</ul>

在这里插入图片描述

注意事项：

ul标签里面只能包裹li标签 li标签里面可以包裹任何内容

有序列表

作用

布局排列整齐的需要规定顺序的区域

标签

ol嵌套li，ol是有序列表，li是列表条目

示例：

<ol>
  <li>第一项</li>
  <li>第二项</li>
  <li>第三项</li>
  ……
</ol>

注意事项：

ol标签里面只能包裹li标签 li标签里面可以包裹任何内容

定义列表

标签

dl嵌套dt和dd，dl是定义列表，dt是定义列表的标题， dd是定义列表的描述 /详情

示例

<dl>
  <dt>列表标题</dt>
  <dd>列表描述 / 详情</dd>
   ……
</dl>

注意事项：

dl里面只能包含dt和dd dt和dd里面可以包含任意内容

表格-基本用法

网页中的表格与Excel表格类似，用来展示数据。

标签

table嵌套tr，tr嵌套td/th

标签名及说明

注意事项：

在网页中，表格默认没有边框线，使用border属性可以为表格添加边框线

表格结构标签

作用

用表格结构标签把内容划分区域，让表格结构更清晰，语义更清晰

合并单元格

作用

将多个 单元格合并成一个单元格，以合并同类信息

步骤

1.明确合并目标 2.保留最左最上的单元格，添加属性（取值是数字，表示需要合并的单元格数量） 跨行合并，保留最上的单元格，添加属性rowspan 跨列合并，保留最左单元格，添加属性colspan 3.删除其他单元格