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="https://www.cnblogs.com/wyh518/archive/2022/11/06/視頻路徑" controls autoplay></video>
音頻標簽
src：指定要播放的音頻檔案的路徑 trols：提供播放、暫停和音量的控制元件 <audio src="https://www.cnblogs.com/wyh518/archive/2022/11/06/音頻路徑" controls autoplay></video>
4、頁面結構分析
HTML5結構元素
5、行內框架
iframe 單頁面行內
src：參考頁面地址 name：框架標識名 <iframe src="https://www.cnblogs.com/wyh518/archive/2022/11/06/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/
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/528091.html
標籤：其他
下一篇：表單