1、列表 無序列表和定義列表在網頁製作中應用非常廣泛 什麼是列表： 列表就是信息資源的一種展示形式。它可以使信息結構化和條理化，並以列表的樣式顯示出來，以便瀏覽者能更快捷地獲得相應的信息。 無序列表 <!--ul 聲明無序列表--> <ul> <!--li 聲明列表項--> <li>語文</li> ...
1、列表
無序列表和定義列表在網頁製作中應用非常廣泛
什麼是列表：
列表就是信息資源的一種展示形式。它可以使信息結構化和條理化，並以列表的樣式顯示出來，以便瀏覽者能更快捷地獲得相應的信息。
無序列表
<!--ul 聲明無序列表-->
<ul>
<!--li 聲明列表項-->
<li>語文</li>
<li>數學</li>
<li>英語</li>
<li>電腦</li>
</ul>
列表項中可以包含圖片、文本，還可以嵌套列表、其他標簽等
無序列表的特性
- 沒有順序，每個< li>標簽獨占一行（塊元素）
- 預設<li>標簽項前面有個實心小圓點
- 一般用於無序類型的列表，如導航、側邊欄新聞、有規律的圖文組合模塊等
有序列表
<!--ol 聲明有序列表-->
<ol>
<li>語文</li>
<li>數學</li>
<li>英語</li>
<li>電腦</li>
</ol>
有序列表預設以數字序號顯示
有序列表與無序列表一樣，也可以嵌套列表、可以包含圖片、文本、其他標簽等
有序列表的特性
- 有順序，每個< li>標簽獨占一行（塊元素）
- 預設< li>標簽項前面有順序標記
- 一般用於排序類型的列表，如試卷、問卷選項等
自定義列表
<!--dl 聲明定義列表-->
<dl>
<!--dt 聲明列表項-->
<dt>水果</dt>
<!--dd 定義列表項內容-->
<dd>蘋果</dd>
<dd>桃子</dd>
<dd>李子</dd>
</dl>
定義列表也可以嵌套列表、包含圖片、文本、其他標簽等
以後的網頁製作中經常會用到定義列表，特別是圖文混排的情況
定義列表的特性
- 沒有順序，每個< dt>標簽、< dd>標簽獨占一行（塊元素）
- 預設沒有標記
- 一般用於一個標題下有一個或多個列表項的情況
小結：列表對比
列表之間可以互相嵌套，進行頁面的局部佈局
2、表格
基本結構
- 單元格
- 行
- 列
表格的基本語法
<!--table表格標簽-->
<table border="1px">
<!--tr 行標簽-->
<tr>
<!--td 單元格標簽-->
<td>第1個單元格的內容</td>
<td>第2個單元格的內容</td>
……
</tr>
<tr>
<td>第1個單元格的內容</td>
<td>第2個單元格的內容</td>
……
</tr>
</table>
表格的跨列
<table>
<tr>
<!--colspan 所跨的列數-->
<td colspan="n">單元格內容</td>
</tr>
<tr>
<td>單元格內容</td>
……
</tr>
......
</table>
表格的跨行
<table >
<tr>
<!--rowspan 所跨的行數-->
<td rowspan="n"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
</table>
表格的跨行和跨列
<table>
<tr>
<!--跨列-->
<td colspan="3">學生成績</td>
</tr>
<tr>
<!--跨行-->
<td rowspan="2">張三</td>
<td>語文</td>
<td>98</td>
</tr>
</table>
3、音頻、視頻
如何實現在網頁上播放視頻和音頻？
- 第三方自主開發的播放器
- Flash
- HTML5媒體元素
在HTML5問世之前，要在網頁上展示視頻、音頻、動畫等，除了使用第三方自主開發的播放器外，使用 最多的工具應該算是Flash了，但是它需要在瀏覽器上安裝各種插件才能使用，有時候速度也會非常慢。 HTML5的出現改變了這一狀況，在網頁中使用HTML5來播放音頻、視頻再也不需要安裝插件，只需要一 個支持HTML5的瀏覽器就可以了。
視頻標簽
src：指定要播放的視頻文件的路徑 controls：提供播放、暫停和音量的控制項 autoplay：自動播放屬性 loop：視頻的迴圈播放 <video src="視頻路徑" controls autoplay></video>
音頻標簽
src：指定要播放的音頻文件的路徑 trols：提供播放、暫停和音量的控制項 <audio src="音頻路徑" controls autoplay></video>
4、頁面結構分析
HTML5結構元素
5、內聯框架
iframe 單頁面內聯
src：引用頁面地址 name：框架標識名 <iframe src="path" name="mainFrame" ></iframe>
iframe屬性（實現頁面間的相互跳轉）
在被打開的框架上加name屬性 <iframe name="mainFrame"></iframe> 在超鏈接上設置target目標視窗屬性為希望顯示的框架視窗名 <a href="https://www.baidu.com/" target="mainFrame">載入</a>
6、小結
本文來自博客園，作者：腹白，轉載請註明原文鏈接：https://www.cnblogs.com/wyh518/
