HTML最基础的标签

HTML标签

定义列表

1.三个标签

• dl 标签定义一个描述列表。
• dd标签被用来对一个描述列表中的项目/名字进行描述。
• dt标签定义一个描述列表的项目/名字。在 dd标签内，您能放置段落、换行、图片、链接、列表等等。

（嵌套规则）代码如下：

<dl>
  <dt></dt>
  <dd></dd>
  <dt></dt>
  <dd></dd>
  <dd></dd>
</dl>

2.特点

1. dd与dt属于同级标签。
2. dd标签是对dd标签的解释说明

应用场景

• 目录介绍

• 京东侧边导航

二、超链接标签

作用
页面跳转，从一个页面跳转到另外一个页面 超链接可以是一个字，一个词，或者一组词*，也可以是图片**，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。
代码格式如下：

<a href="https://www.baidu.com/">百度</a>

常用属性

• href属性 , 规定跳转到制定页面的URL，

<a href="值"></a>

1. 值为一个网络地址，

<a href="https://www.baidu.com/">百度</a>

2. 值是内部的文件路径

<a href="./img/erji.jpg">百度</a>

3. 值是一个后缀为压缩文件或者exe,此时会下载文件
4. 值是一个标签的id属性值，页面直接跳转到该标签的位置

<!-- 格式#+id值 -->
<a href="#01">百度</a>

5. 值为# 点击后直接跳转至页面顶部，默认链接颜色变化

<a href="#">百度</a>

6. 值为javasrcipt: 链接不变色，不跳转

<a href="javasrcipt:">百度</a>

3应用场景

在企业开发软件前期，我们无法知道页面具体要跳转到那个页面，先写成空链接，然后等后期页面完成以后，再更换为真实的地址

三、实体字符

1、语意

HTML 中的预留字符必须被替换为字符实体。一些在键盘上找不到的字符也可以使用字符实体来替换。
直接写在代码中。

语法格式

四、table(表格）

1、语意

表格是有行和列组成，行标签有tr,一列代表一个单元格，单元格的内容可以是文字，图片，列表，段落，表单等等。

• table定义一个表格
• th 定义表格的表头
• tr定义一行。
• td定义一个单元格
  -td和th是容器标签

2、基本格式

 <table>
        <tr>
            <dd></dd>
        </tr>
    </table>

3、表格组成四部分，标题，表头，表体，表尾。其中表头，表体，表尾，都可以放置tr和td。

<table>
      <caption>标题</caption>
      <thead>表头</thead>
      <tbody>表体</tbody>
      <tfoot>表尾</tfoot>
    </table>

3、常用属性

table

1. width 宽度、单位px。
2. height 高度、单位px。
3. border 边框。
4. align 表格水平对齐方式。
5. cellpadding 设置单元格边框与内容之间的间距
6. cellspacing设置单元格与单元格之间的间隙

tr

align属性决定水平对其方式

left左对齐
center居中对齐
right 右对齐

valign决定垂直对齐方式

top顶部对齐
center中间对齐
bottom底部对齐

属性设置失效，

1. 宽高没有设置
2. cellpadding设置过大

td

colspan跨列合并单元格

 <th colspan="4">耕地保有量</th>	

rowspan跨行合并单元格

  <th rowspan="3">地区</th>

5、div与span标签

div标签

1. 属于块容器标签，内部可以嵌套其他标签

  <div>
      <h1></h1>
      <a href="#"></a>
    </div>

2. 独占一行显示

  <div>
        我独占一行，
    </div>太霸道了

span标签

行内元素，包含文字，一行可以放置多个span标签，由内容决定大小，