Skip to content

Latest commit

 

History

History
147 lines (114 loc) · 5.08 KB

index.md

File metadata and controls

147 lines (114 loc) · 5.08 KB
Raw
title slug l10n
<li>：列表项元素
Web/HTML/Element/li
sourceCommit
829db137a01feb14af7beaec178a3ea0118b4777

{{HTMLSidebar}}

<li> HTML 元素用于表示列表中的项目。它必须包含在一个父元素中：有序列表（{{HTMLElement("ol")}}）、无序列表（{{HTMLElement("ul")}}）或菜单（{{HTMLElement("menu")}}）。在菜单和无序列表中，列表项通常使用项目符号显示。在有序列表中，通常在左侧显示一个升序计数器，如数字或字母。

{{EmbedInteractiveExample("pages/tabbed/li.html", "tabbed-shorter")}}

属性

这个元素包含全局属性。

  • value

    • : 这个整数属性指示由 {{HTMLElement("ol")}} 元素定义的列表项当前序数值。该属性唯一允许的值是数字，即使列表以罗马数字或字母显示。后面的列表项从数值集开始继续编号。对于无序列表（{{HTMLElement("ul")}}）或菜单（{{HTMLElement("menu")}}），value 属性没有意义。

  • type {{Deprecated_inline}} {{Non-standard_Inline}}

    • : 该字符属性表示编号类型：

      • a: 小写字母
      • A: 大写字母
      • i: 小写罗马数字
      • I: 大写罗马数字
      • 1: 数字

      该类型会覆盖其父元素 {{HTMLElement("ol")}} 使用的类型（如果有的话）。

      [!NOTE] 该属性已被弃用；请使用 CSS {{cssxref("list-style-type")}} 属性代替。

示例

有关更详细的示例，请参阅 {{htmlelement("ol")}} 和 {{htmlelement("ul")}} 页面。

有序列表

<ol>
  <li>第一项</li>
  <li>第二项</li>
  <li>第三项</li>
</ol>

结果

{{EmbedLiveSample("有序列表")}}

带有自定义值的有序列表

<ol type="I">
  <li value="3">第三项</li>
  <li>第四项</li>
  <li>第五项</li>
</ol>

结果

{{EmbedLiveSample("带有自定义值的有序列表")}}

无序列表

<ul>
  <li>第一项</li>
  <li>第二项</li>
  <li>第三项</li>
</ul>

结果

{{EmbedLiveSample("无序列表")}}

技术概要

内容分类 无。
允许的内容 流式内容。
标签省略 如果列表项后面紧跟着另一个 {{HTMLElement("li")}} 元素，或者其父元素中没有更多内容，则可以省略结束标记。
允许的父元素 一个 {{HTMLElement("ul")}}、{{HTMLElement("ol")}} 或 {{HTMLElement("menu")}} 元素。过时的 {{HTMLElement("dir")}} 也可以作为父级元素，但这种用法并不符合规范。
隐含的 ARIA 角色 如果是 ol、ul 或 menu 的子项，则为 listitem
允许的 ARIA 角色 menuitem、menuitemcheckbox、menuitemradio、option、none、presentation、radio、separator、tab、treeitem
DOM 接口 {{domxref("HTMLLIElement")}}

规范

{{Specifications}}

浏览器兼容性

{{Compat}}

参见

  • 其他与列表相关的 HTML 元素：{{HTMLElement("ul")}}、{{HTMLElement("ol")}}、{{HTMLElement("menu")}} 和过时的 {{HTMLElement("dir")}}；

  • 特别适用于为 <li> 元素添加样式的 CSS 属性：

    • {{cssxref("list-style")}} 属性，用于选择显示序号的方式；
    • CSS 计数器，用于处理复杂的嵌套列表；
    • {{cssxref("margin")}} 属性，用于控制列表项的缩进。