XHTML高級(jí)教程-列表

2021-11-30 10:02 更新

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

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

在詳細(xì)進(jìn)入列表之前，必須理解列表索引標(biāo)記的概念。


列表索引標(biāo)簽

列表索引標(biāo)簽被寫(xiě)為<li>。它定義了一個(gè)列表項(xiàng)的開(kāi)始。<li>標(biāo)簽用于無(wú)序列表和有序列表。

代碼示例： 

<li>列表索引標(biāo)記的例子在稍后以無(wú)序和有序列表的示例顯示。</li>

效果展示：

  • 列表索引標(biāo)記的例子在稍后以無(wú)序和有序列表的示例顯示。


    • 無(wú)序列表

    無(wú)序列表由<ul>標(biāo)簽定義。它包含項(xiàng)目前面有項(xiàng)目符號(hào)或標(biāo)記的項(xiàng)目列表。

    代碼示例： 

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

    效果展示：

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

    XHTML不支持HTML的<ul>標(biāo)記的“compact”和“type”屬性。


    有序列表

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

    代碼示例： 

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

    效果展示：

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


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

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

    在瀏覽器中的展示效果：



    以上內(nèi)容是否對(duì)您有幫助：
    在線筆記
    App下載
    App下載

    掃描二維碼

    下載編程獅App

    公眾號(hào)
    微信公眾號(hào)

    編程獅公眾號(hào)