本文介绍了HTML的基本元素，包括块级元素如p和h1-h6，它们各自占据一行；行内元素如a、strong和em，允许在同一行内并排显示；以及有序列表、无序列表和自定义列表的使用。此外，还详细讲解了HTML表格的创建，包括表格的border属性、tr和td标签、colspan和rowspan属性，以及如何实现跨行跨列的效果。通过实例展示了如何创建一个学生成绩表格。
块元素
无聊内容多少，该元素独占一行
（p、h1-h6)
行内元素
内容撑开宽度，左右都是行内元素的可以排在一行
（a、strong、em)
列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>列表学习</title>
</head>
<body>
<!--有序标签
-->
<ol>
<li>java</li>
<li>C++</li>
<li>运维</li>
<li>Python</li>
</ol>
<hr/>
<!--无序列表-->
<ul>
<li>java</li>
<li>C++</li>·，4
<li>运维</li>
<li>Python</li>
</ul>
<!--自定义列表-->
<!--
dl:标签
dt:列表名称
dd:列表内容
运用场地：网站底部
-->
<dl>
<dt>编程语言</dt>
<dd>java</dd>
<dd>C++</dd>
<dd>运维</dd>
<dd>Python</dd>
</dl>
</body>
</html>
表格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格标签学习</title>
</head>
<body>
<!--表格table border 表格边框
行 tr
列 td
-->
<table border="1px">
<tr>
<!--colspan 跨列-->
<td colspan="4">1-1</td>
</tr>
<tr>
<!--rowspan 跨列-->
<td rowspan="2">2-1</td>
<td>2-2</td>
<td>2-3</td>
<td>2-4</td>
</tr>
<tr>
<td>3-1</td>
<td>3-2</td>
<td>3-3</td>
</tr>
</table>
</body>
</html>
跨行跨列
自制一个成绩表格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格标签学习</title>
</head>
<body>
<!--表格table border 表格边框
行 tr
列 td
-->
<table border="1px">
<tr>
<!--colspan 跨列-->
<td colspan="3">学生成绩</td>
</tr>
<tr>
<!--rowspan 跨行-->
<td rowspan="2">张三</td>
<td>语文</td>
<td>89</td>
</tr>
<tr>
<td>数学</td>
<td>99</td>
</tr>
<tr>
<td rowspan="2">李四</td>
<td>语文</td>
<td>90</td>
</tr>
<tr>
<td>数学</td>
<td>88</td>
</tr>
</table>
</body>
</html>
1234
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
