前言###
其实我完成作业的顺序有点问题，按理说应该是从简单的入手，但我却先完成了试卷篇。不过在那次作业中已经有了对于列表的理解，这次写起来也就So Easy了。
作业简述###
作业分析###
有目标图片我们可以很快得出这样一个事实：这个列表嵌套了三层。最外层是一个由两项内容组成的无序列表，对于最外层的每项中嵌套了一个有序列表，最内层，也就是有序列表的每项中又套着一个无序列表。
值得注意的是最外层的两项结构是完全一样的！！！
那就意味着我们完成其中一项的代码编写后，另一项基本可以采用Ctrl+c、Ctrl+v来完成，然后我们再看，次外层的有序列表的两项结构也是一致的，那么实际的HTML代码需要完全手动书写的只有看上的的四分之一。（其中的无序列表还可以再分，只是太简单了，没必要。。。这大概算是偷懒了。。。）
实际需要编写HTML代码的部分，其他的代码可以通过复制+修改文本内容完成
分析到这里，就可以动手写代码了。
我的HTML代码###
<html>
<body>
<ul>
<li>
<div>JavaScript</div>
<div>
<ol>
<li>
<div>第一章</div>
<div>
<ul>
<li>const</li>
<li>let</li>
</ul>
</div>
</li>
<li>
<div>第二章</div>
<div>
<ul>
<li>function</li>
<li>package</li>
</ul>
</div>
</li>
</ol>
</div>
</li>
<li>
<div>Java</div>
<div>
<ol>
<li>
<div>第一章</div>
<div>
<ul>
<li>class</li>
<li>package</li>
</ul>
</div>
</li>
<li>
<div>第二章</div>
<div>
<ul>
<li>private</li>
<li>public</li>
</ul>
</div>
</li>
</ol>
</div>
</li>
</ul>
</body>
</html>
效果如图：
效果图1
可以看到，还是存在类似试卷篇中的缩进问题。。。不过这并不是什么大问题，之后使用CSS，应该可以解决。
至于字体，应该和浏览器有关，同样的代码，我在FireFox上打开就是下图效果：
效果图2
明显更为饱满一些。
总结###
最后，再总结一下列表的使用。
列表相关标签常用的有三个
| 标签 | 作用 |
|---|---|
| ol | 生成有序列表 |
| ul | 生成无序列表 |
| li | 生成表项 |
要是觉得不够用，可以在记一个type属性，在使用无序列表时，可以用来改变表项前符号的形状；使用有序列表时，可以改变序号的类型（阿拉伯数字或罗马数字等）。
注：对于代码中的大量<div>使用的原因，是之前听别人讲，这个可以用来表达出作者的写代码的逻辑，所以就尝试了一下。不过现在看着，我自己是能理解里面的逻辑关系，不知道读者能不能看懂。若不能，希望可以提一些意见或者建议，谢谢~
