HTML <li>用法及代碼示例

HTML中的<li>標記用於定義HTML文檔中的列表項。它在有序列表<ol>或無序列表<ul>中使用。 <li>標記需要一個開始標記和結束標記。注意：如果列表項後緊跟另一個<li>元素，或者如果其父元素中沒有更多內容，則可以省略end標記。

用法:

<li> List Items </li>

屬性值：

value：value屬性用於指定列表項的起始編號。列表項從該數字開始，並在每次增加項目時增加其值。 value屬性僅適用於有序列表，即<ol>標記。

範例1：此示例在有序列表中使用<li>標記。

html

<!DOCTYPE html> 
<html> 
  
<body> 
    <h1>GeeksforGeeks</h1> 
      
    <h2>HTML li Tag</h2> 
  
    <ol> 
        <li>Geeks</li> 
        <li>Sudo</li> 
        <li>Gfg</li> 
        <li>Gate</li> 
        <li>Placement</li> 
    </ol> 
</body> 
  
</html>

輸出：

範例2：此示例將<li>標記與無序列表一起使用。

html

<!DOCTYPE html> 
<html> 
  
<body> 
    <h1>GeeksforGeeks</h1> 
  
    <h2>HTML li Tag</h2> 
  
    <ul> 
        <li>Geeks</li> 
        <li>Sudo</li> 
        <li>Gfg</li> 
        <li>Gate</li> 
        <li>Placement</li> 
    </ul> 
</body> 
  
</html>

輸出：

範例3：本示例使用具有值屬性的<li>標記創建列表。

HTML

<!DOCTYPE html> 
<html> 
  
<body> 
    <h1>GeeksforGeeks</h1> 
  
    <h2>HTML li Tag</h2> 
  
    <ol> 
        <li value="5">Geeks</li> 
        <li>Sudo</li> 
        <li>Gfg</li> 
        <li>Gate</li> 
        <li>Placement</li> 
    </ol> 
</body> 
  
</html>

輸出：

將樣式應用於<li>標簽：某些CSS屬性也可以用於設置<li>元素的樣式，這些元素是：list-style，list-style-image，list-style-position和list-style-type。這些屬性可以直接應用於<li>元素，盡管它們通常應用於父元素。

支持的瀏覽器：

穀歌瀏覽器
IE瀏覽器
Firefox
Opera
Safari

相關用法

注：本文由純淨天空篩選整理自MayankKhare大神的英文原創作品 HTML <li> Tag。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。