HTML的列表，表格與媒體元素

一.無序列表

                        <ul>
                            <li>無序列表</li>
                            <li>有序列表</li>
                            <li>自定義列表</li>
                        </ul>

                    特性：1.沒有順序，每一個<li>標籤獨佔一行（塊級元素）
                          2.默認每個li標籤前有一個實心小圓點
                          3.主要用於無序類型信息的展現，如導航欄等




            二.有序列表

                        <ol>
                            <li>無序列表</li>
                            <li>有序列表</li>
                            <li>自定義列表</li>
                        </ol>

                    特性：1.有順序，每一個<li>標籤獨佔一行（塊級元素）
                          2.默認每個li標籤前有順序標識
                          3.通常用於排序類型的列表，如試卷、問卷選項等

            三：定義列表

                        <dl>
                            <dt>列表項1</dt>
                                <dd>列表項1內容1</dd>
                                <dd>列表項1內容2</dd>
                            <dt>列表項2</dt>
                                <dd>列表項2內容1</dd>
                                <dd>列表項2內容2</dd>
                        </dl>

                    特性：1.沒有順序，每個dt和dd標籤獨佔一行（塊元素）
                          2.默認沒有標記
                          3.通常用於一個標題下有一個或多個列表項的狀況

            四.表格

                    組成部分:行
                             列
                             單元格
                    表格優勢：結構穩定
                              簡單通用


                    <table border="1" align="right">
                        <tr>
                            <td rowspan="2">張三</td>

                            <td>語文</td>
                            <td>98</td>
                            <tr>
                                <td>數學</td>
                                <td>89</td>
                            </tr>
                            </tr>

                        <tr>
                            <td rowspan="2">李四</td>

                            <td>語文</td>
                            <td>76</td>
                            <tr>
                                <td>數學</td>
                                <td>60</td>
                            </tr>
                        </tr>

                    </table>

                    <!--border：邊框粗細        align：位置    center：居中        colspan：跨列   rowspan：跨行-->
                    <table border="1" align="center">
                            <tr>
                                    <td colspan="2" align="center">分數</td>

                            </tr>
                            <tr>
                                    <td>89</td>
                                    <td>95</td>
                            </tr>

                    </table>

            五.媒體元素
                        video:視頻
                                <video controls autoplay>
                                    <source src="視頻地址 " type="video/視頻格式">
                                    <source src="視頻地址 " type="video/視頻格式">
                                </video>
                        audio:音頻
                                <audio controls autoplay>
                                    <source src="音頻地址 " type="audio/音頻格式">
                                    <source src="音頻地址 " type="audio/音頻格式">
                                </audio>

            六.頁面格局結構
                        header    標題頭部區域的內容（用於頁面或頁面中的一塊區域）
                        footer    標記腳部區域的內容（用於整個頁面或頁面的一塊區域）
                        section    Web頁面中的一塊獨立區域
                        article    獨立的文章內容
                        aside    相關內容或應用（經常使用於側邊欄）
                        nav    導航類輔助內容
                        <header style="border: 1px; height: 100px;"><h1>頁面頭部</h1></header>
                        <section style="border: 1px; height: 500px;"><h1>頁面主題部分</h1></section>
                        <footer style="border: 1px; height: 100px;"><h1>頁面腳部</h1></footer>

            七.內聯框架
                        <iframe src="嵌套地址" name="自定義名稱"></iframe>
                        <!--target值必須和iframe的name屬性值相等才能完成點擊a標籤時會在內聯框架中顯示要跳轉的頁面-->
                        <a href="頁面地址" target="內聯框架自定義名稱"></a>