整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
嘍大家好，我是作者“未來”，本期分享的內容是Web前端系列課程，本系列總共29個階段，堅持學習3個月蛻變為Web前端高手哦！
志同道合的小伙伴跟我一起學習交流哦！
把制成表以表顯示容器里面裝載著文字或圖表的一種形式，叫列表。
列表最大的特點就是整齊、整潔、有序
1 無序列表ul（重點）
無序列表的各個列表項之間沒有順序級別之分，是并列的。其基本語法格式如下：
顯示效果：
· 列表項1
· 列表項2
· 列表項3
2 無序列表注意事項
1.<和l<><>
2.
3.無序列表會帶有自己樣式屬性，放下那個樣式，一會讓CSS來！
3 有序列表ol（了解）
有序列表即為有排列順序的列表，其各個列表項按照一定的順序排列定義，有序列表的基本語法格式如下：
顯示效果：
1. 中國
2. 美國
5 自定義列表（理解）
定義列表常用于對術語或名詞進行解釋和描述，定義列表的列表項前沒有任何項目符號。其基本語法如下：
顯示效果：
四大名著
水滸傳
西游記
三國演義
紅樓夢
瀏覽器
谷歌
火狐
6 課程總結
看不懂的小伙伴不要氣餒，后續的分享中將持續解釋，只要你跟著我分享的課程從頭到尾去學習，每篇文章看三遍，一個月后，回過頭來看之前的文章就會感覺簡單極了。
本章已結束，下篇文章將分享《06列表》小伙伴們不要錯過喲！
av元素是什么？
Nav元素用于定義導航鏈接，是HTML5新增的元素，該元素可以將具有導航性質的鏈接歸納在一個區域中，使頁面元素的語義更加明確。其中的導航元素可以鏈接到站點的其他頁面或者當前頁的其他部分。
Nav元素可以用作頁面導航的鏈接組，在導航鏈接組里面有很多的鏈接，點擊每個鏈接可以鏈接到其他頁面或者當前頁面的其他部分，并不是所有的鏈接組都要被放在Nav元素里面，只需要把最主要的、基本的、重要的放在Nav元素里面即可。
比如說頁腳底部如果有個版權聲明，不建議使用Nav元素，而建議使用footer元素是最合適的。一個頁面中可用多個Nav元素作為整體或者不同部分的導航
示例代碼：
Nav元素示例代碼
在上面這段代碼中，通過在Nav元素內部嵌套無序列表ul來搭建導航結構。通常一個HTML頁面中可以包含多個Nav元素，作為頁面整體或不同部分的導航。
具體來說Nav元素可以用的場景如下：
1.傳統導航條：目前主流網站上都有不同層級的導航條，其作用是跳轉到網站的其他主頁面。
2.側邊欄導航：目前主流博客網站及電商網站都有側邊欄導航，目的是將當前文章或當前商品頁面跳轉到其他文章或其他商品頁面。
3.頁內導航：它的作用是在本頁面幾個主要的組成部分之間進行跳轉。
4.翻頁操作：翻頁操作切換的是網頁的內容部分，可以通過單擊“上一頁”或“下一頁”切換，也可以通過單擊實際的頁數跳轉到某一頁。
除此Nav元素也可以用于其他重要的、基本的導航鏈接組中。并不是所有的鏈接組都要被放進Nav元素，只需要將主要的和基本的鏈接放進Nav元素即可。
1.1ul無序列表標簽
基本結構:
<ul>
<li>國際新聞</li>
<li>國內新聞</li>
<li>軍事熱點</li>
<li>數碼、科技</li>
<li>時裝</li>
</ul>
注意：
1.ul標簽和li標簽是組合使用。
2.li標簽里面可以添加任何內容，或者嵌套標簽也可以
3.無序列表會自動生成一個小圓點，一般在實際應用中會去掉。
1.2有序列表ol
語法：定義子項順序的。一般有編號（數字或字母或希臘字母）
<ol>
<li>小西瓜</li>
</ol>
注意：
有序列表type屬性的幾個值：
A表示顯示的編號是大寫字母
a表示編號是小寫字母
I表示編號是羅馬數字
i表示編號是小寫羅馬數字
默認情況下顯示的是數字
實例：
<ol type="1" start="5">
<li><a href="">小蘋果</a></li>
<li><a href="">小西瓜</a></li>
<li><a href="">草莓</a></li>
<li><a href="">西紅柿</a></li>
<li><a href="">獼猴桃</a></li>
<li><a href="">藍莓</a></li>
</ol>
<ol type="a" >
<li><a href="">小蘋果</a></li>
<li><a href="">小西瓜</a></li>
<li><a href="">草莓</a></li>
<li><a href="">西紅柿</a></li>
<li><a href="">獼猴桃</a></li>
<li><a href="">藍莓</a></li>
</ol>
<ol type="A">
<li><a href="">小蘋果</a></li>
<li><a href="">小西瓜</a></li>
<li><a href="">草莓</a></li>
<li><a href="">西紅柿</a></li>
<li><a href="">獼猴桃</a></li>
<li><a href="">藍莓</a></li>
</ol>
<ol type="i">
<li><a href="">小蘋果</a></li>
<li><a href="">小西瓜</a></li>
<li><a href="">草莓</a></li>
<li><a href="">西紅柿</a></li>
<li><a href="">獼猴桃</a></li>
<li><a href="">藍莓</a></li>
</ol>
<ol type="I">
<li><a href="">小蘋果</a></li>
<li><a href="">小西瓜</a></li>
<li><a href="">草莓</a></li>
<li><a href="">西紅柿</a></li>
<li><a href="">獼猴桃</a></li>
<li><a href="">藍莓</a></li>
</ol>
2.3定義列表dl
什么是定義列表
dl標簽定義了定義列表，通常用于名稱的解釋或者概念的定義。每個子項分為2個部分，一部分負責定義，另一部分負責解釋
<dl>
<dt>計算機資料</dt>
<dd>H5前端開發</dd>
<dd>JavaScript</dd>
<dd>NodeJS入門到精通</dd>
<dd>PhP語法入門到精通</dd>
<dt>文學書籍</dt>
<dd>詩歌</dd>
<dd>小說</dd>
<dd>散文</dd>
</dl>
<!--
dl:定義了一個定義列表
dt:術語部分
dd:對術語或項目進行解釋的部分
-->
2.1表格的使用
（1）table標簽
（2）表格行、列的合并
<table>：定義表格
<tr>:定義表格的行
<td>：定義表格的列
<th> ：定義表格表頭單元格
<thead>:定義表格中表頭的內容
<tbody>:定義表格中的主體內容
<tfoot>:定義表格中的腳注
<caption>:定義表格標題
<!--
cellspacing:單元格與單元格之間的距離
cellpadding：內容與單元格之間的距離
border：單元格邊框寬度
bgcolor:設置背景色
-->
<table width="360" border="1" cellspacing="0" cellpadding="0" align="center" >
<tr bgcolor="aqua"><th>學號</th><th>姓名</th></tr>
<tr align="center"><td>001</td><td>張三</td></tr>
<tr align="center"><td>002</td><td>李四</td></tr>
<tr align="center"><td>003</td><td>王五</td></tr>
<tr align="center"><td>004</td><td>趙六</td></tr>
</table>
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
