XHTML高級教程-列表

2021-11-30 10:02 更新

列表是XHTML文檔中的一個元素。在網(wǎng)頁上布置信息內容的一個好方法是通過列表。列表易于理解，使網(wǎng)頁內容布局更清晰。

XHTML中的列表與HTML中的列表非常相似。唯一的區(qū)別是HTML中使用的列表的一些屬性不被XHTML支持。

在詳細進入列表之前，必須理解列表索引標記的概念。


列表索引標簽

列表索引標簽被寫為<li>。它定義了一個列表項的開始。<li>標簽用于無序列表和有序列表。

代碼示例： 

<li>列表索引標記的例子在稍后以無序和有序列表的示例顯示。</li>

效果展示：

  • 列表索引標記的例子在稍后以無序和有序列表的示例顯示。


    • 無序列表

    無序列表由<ul>標簽定義。它包含項目前面有項目符號或標記的項目列表。

    代碼示例： 

    <ul>
<li>HTML教程 </li>
<li>XHTML教程 </li>
<li>CSS教程</li>
</ul>

    效果展示：

    • HTML教程
    • XHTML教程
    • CSS教程

    XHTML不支持HTML的<ul>標記的“compact”和“type”屬性。


    有序列表

    有序列表由<ol>標簽定義。它包含項目前面有數(shù)字或字母順序編號標記的項目列表。

    代碼示例： 

    <ol>
<li>HTML教程 </li>
<li>XHTML教程 </li>
<li>CSS教程</li>
</ol>

    效果展示：

    1. HTML教程
    2. XHTML教程
    3. CSS教程


    以下示例說明了在網(wǎng)頁中使用列表的方式： 

    <html>
<head>
<title> W3Cschool在線教程 </title>
</head>
<body>
<h1>WEB前端開發(fā)教程 </h1>
<ul>
<li>HTML教程 </li>
<li>XHTML教程 </li>
<li>CSS教程</li>
</ul>
<hr/>
<ol>
<li>技術教程</li>
<li>開發(fā)文檔</li>
<li>編程微課</li>
</ol>
</body>
</html>

    在瀏覽器中的展示效果：



    以上內容是否對您有幫助：
    在線筆記
    App下載
    App下載

    掃描二維碼

    下載編程獅App

    公眾號
    微信公眾號

    編程獅公眾號