今天，我要實現的列表是這樣的：

目標列表

列表實現的源代碼參見github

完成這個列表我們來拆分一下任務吧，這個列表從外向里可劃分為３層。

１．實現最外層的無序列表，代碼是這樣的：

<ul>   
   <li>JavaScript</li>    
   <li>Java</li>
</ul>

結果長成這樣：

第一步結果圖

２．實現中間層的有序列表，代碼是這樣的：

<ul>    
     <li>JavaScript        
         <ol>          
             <li>第一章</li>           
             <li>第二章</li>       
       </ol>   
    </li>    
    <li>Java        
         <ol>           
             <li>第一章</li> 
             <li>第二章</li>    
         </ol>   
    </li>
</ul>

第二步實現結果圖：

第二步結果圖

3.實現第三層的無序列表，代碼長這樣(這里是部分代碼哦，在第二步的基礎上增加)：

<li>JavaScript 
　 <ol>       
     <li>第一章           
          <ul type="square">
              <li>const</li>        
              <li>let</li>     
          </ul> 
     </li>  
     <li>第二章 
          <ul type="square">
              <li>function</li>
              <li>object</li>
         </ul>      
     </li>   
   </ol>
</li>

第三步的實現的結果是這樣的：

第三步結果

好了，就這樣三步這個簡單的列表就完成了

小知識：

• 實現下面這樣的無序列表在ul標簽中加type="disc"或省略type不寫
  
  黑點無序列表
• 實現這樣的無序列表在ul標簽中加type="circle"
  
  圓圈無序列表
• 實現這樣的無序列表在ul標簽中加type="square"
  
  方塊無序列表