实现如下的列表
- 首先了解一下什么是html 列表,可以分为有序,无序和自定义的,要实现上图的列表,需要将有序和无序列表相结合。
- 无序列表如何定义
<ul>
<li> 内容</li>
<li> 内容</li>
···
</ul>
- 效果如下
- 有序列表的定义
<ol>
<li> 内容</li>
<li> 内容</li>
...
</ol>
- 效果如下
- 自定义列表定义
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
- 效果如下
-
最后我自己实现该效果的代码
附上实现代码
<ul>
<li>javascript</li>
<ol>
<li>第一章
<ul>
<li>const</li>
<li>let</li>
</ul>
</li>
<li>第二章
<ul>
<li>function</li>
<li>object</li>
</ul>
</li>
</ol>
<li>java</li>
<ol>
<li>第一章
<ul>
<li>class</li>
<li>package</li>
</ul>
</li>
<li>第二章
<ul>
<li>private</li>
<li>public</li>
</ul>
</li>
</ol>
</ul>