常用文本、列表与表格标签
常用文本标签
标题标签
<h1> 到 <h6> 用于定义标题。- 数字越小，标题级别越高，默认字体也越大。
1
2
3
4
| <h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
|
段落标签
文本样式标签
<b>、<strong>：加粗文本<i>、<em>：斜体文本<u>、<ins>：下划线文本<s>、<del>：删除线文本
1
2
3
4
5
6
7
8
9
10
| <p>
<b>字体加粗</b>
<strong>字体加粗</strong>
<i>字体斜体</i>
<em>字体斜体</em>
<u>字体下划线</u>
<ins>字体下划线</ins>
<s>字体删除线</s>
<del>字体删除线</del>
</p>
|
课堂示例代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| <h1>标题标签Hello, World!</h1>
<h2>Hello, World!</h2>
<h3>Hello, World!</h3>
<h4>Hello, World!</h4>
<p>段落标签Hello, World!</p>
<p>
段落标签，
<b>字体加粗</b>
<strong>字体加粗</strong>
<i>字体斜体</i>
<em>字体斜体</em>
<u>字体下划线</u>
<ins>字体下划线</ins>
<s>字体删除线</s>
<del>字体删除线</del>
</p>
|
知识点总结
- 标题标签用于表示内容层级。
- 段落标签用于组织普通文本内容。
- 文本样式标签用于强调和修饰文本显示效果。
列表标签
无序列表
<ul> 表示无序列表。<li> 表示列表中的每一项。
1
2
3
4
5
| <ul>
<li>无序列表1</li>
<li>无序列表2</li>
<li>无序列表3</li>
</ul>
|
有序列表
<ol> 表示有序列表。<li> 表示列表中的每一项。
1
2
3
4
5
| <ol>
<li>有序列表1</li>
<li>有序列表2</li>
<li>有序列表3</li>
</ol>
|
课堂示例代码
1
2
3
4
5
6
7
8
9
10
11
| <ul>
<li>无序列表1</li>
<li>无序列表2</li>
<li>无序列表3</li>
</ul>
<ol>
<li>有序列表1</li>
<li>有序列表2</li>
<li>有序列表3</li>
</ol>
|
知识点总结
ul 用于展示没有先后顺序的内容。ol 用于展示有顺序要求的内容。li 是列表项标签，通常配合 ul 或 ol 使用。
表格基础标签
常用表格标签
<table>：定义整个表格。<tr>：定义表格中的一行，table row。<td>：定义普通单元格，table data。<th>：定义表头单元格，table header。
1
2
3
4
5
6
7
8
9
10
11
12
| <table border="1">
<tr>
<th>列标题1</th>
<th>列标题2</th>
<th>列标题3</th>
</tr>
<tr>
<td>单元格1</td>
<td>单元格2</td>
<td>单元格3</td>
</tr>
</table>
|
课堂示例代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| <h1>table row 表格标签</h1>
<h1>table data 表格数据</h1>
<h1>table header 列标题</h1>
<table border="1">
<tr>
<th>列标题1</th>
<th>列标题2</th>
<th>列标题3</th>
</tr>
<tr>
<td>单元格1</td>
<td>单元格2</td>
<td>单元格3</td>
</tr>
</table>
|
知识点总结
- 表格由行和单元格组成。
tr 控制行，td 控制数据单元格，th 控制表头单元格。table 是表格最外层标签。
复习表达
HTML 中常用文本标签包括标题标签 h1-h6、段落标签 p，以及加粗、斜体、下划线、删除线等文本修饰标签。列表标签主要有无序列表 ul 和有序列表 ol，列表项使用 li。表格标签主要包括 table、tr、td 和 th，分别表示表格、行、普通单元格和表头单元格。
