html学习笔记4——列表与表格

列表

有序列表

<ol>
    <li>一号元素</li>
    <li>二号元素</li>
</ol>

ol：ordered lists
l i：list item

无序列表

<ul>
    <li>一号元素</li>
    <li>二号元素</li>
</ul>

ul：unordered lists

自定义列表

<dl>
    <dt>自定义列表组</dt>
    <dd>自定义列表描述</dd>
</dl>

d l：definition lists

d t：definition term

dd：definition description

---

表格

讲解

<table border="1">
    <tr>
        <td colspan="2">每一组</td>
        <td>《tr》</td>
        <td>代表一行</td>
    </tr>
    <tr>
        <td rowspan="2">竖排的</td>
        <td>多少</td>
        <td>以最多元素的行</td>
        <td>为准</td>
    </tr>
    <tr>
        <td>2021-2-26</td>
    </tr>
</table>

table：表格
border：边框
colspan：跨列
rowspan：跨行

作业

题目

尝试打印出一张成绩单吧

---

答案

<table border="1">
    <tr>
        <td colspan="5">2021期末学生成绩单</td>
    </tr>
    <tr>
        <td>学生姓名</td>
        <td>语文</td>
        <td>数学</td>
        <td>外语</td>
        <td>总分</td>
    </tr>
    <tr>
        <td>张三</td>
        <td>88</td>
        <td>106</td>
        <td>51</td>
        <td>245</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>92</td>
        <td>87</td>
        <td>81</td>
        <td>260</td>
    </tr>
    <tr>
        <td>王五</td>
        <td>87</td>
        <td>94</td>
        <td rowspan="2">缺考</td>
        <td>181</td>
    </tr>
    <tr>
        <td>冯六</td>
        <td>83</td>
        <td>104</td>
        <td>187</td>
    </tr>
</table>