diff options
Diffstat (limited to 'files/zh-cn/web/html/element/li/index.html')
| -rw-r--r-- | files/zh-cn/web/html/element/li/index.html | 205 |
1 files changed, 205 insertions, 0 deletions
diff --git a/files/zh-cn/web/html/element/li/index.html b/files/zh-cn/web/html/element/li/index.html new file mode 100644 index 0000000000..2a67616ff5 --- /dev/null +++ b/files/zh-cn/web/html/element/li/index.html @@ -0,0 +1,205 @@ +--- +title: <li> +slug: Web/HTML/Element/li +translation_of: Web/HTML/Element/li +--- +<p>{{HTMLRef}}</p> + +<p><strong>HTML <code><li></code> 元素</strong> （或称 <em>HTML 列表条目元素）</em> 用于表示列表里的条目。它必须包含在一个父元素里：一个有序列表({{HTMLElement("ol")}})，一个无序列表({{HTMLElement("ul")}})，或者一个菜单 ({{HTMLElement("menu")}})。在菜单或者无序列表里，列表条目通常用点排列显示；在有序列表里，列表条目通常在左边显示按升序排列的计数，例如数字或者字母。</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">内容类别</th> + <td>无</td> + </tr> + <tr> + <th scope="row">允许的内容</th> + <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">流式内容</a></td> + </tr> + <tr> + <th scope="row">标签省略</th> + <td>如果列表元素的后面紧随另一个 {{HTMLElement("li")}} 元素，或者它的父元素中没有更多内容，结束标签可以省略。</td> + </tr> + <tr> + <th scope="row">允许的父元素</th> + <td>{{HTMLElement("ul")}}、 {{HTMLElement("ol")}}、 或者 {{HTMLElement("menu")}} 元素。过时的 {{HTMLElement("dir")}} 也可以作为父元素，但是并不提倡。</td> + </tr> + <tr> + <th scope="row">DOM 接口</th> + <td>{{domxref("HTMLLIElement")}}</td> + </tr> + <tr> + <th scope="row">元素类型</th> + <td>块级</td> + </tr> + </tbody> +</table> + +<h2 id="属性">属性</h2> + +<p>这个元素拥有<a href="/en-US/docs/Web/HTML/Global_attributes">全局属性</a>。</p> + +<dl> + <dt>{{htmlattrdef("value")}}</dt> + <dd>这个整数型属性表明了本 {{HTMLElement("li")}} 元素在有序列表 （由 {{HTMLElement("ol")}} 元素定义）中的序号。本属性值只能用数字，即使列表使用罗马数字或字母来展示。随后的列表条目会从设置的值开始计数。<strong>value</strong> 属性对于无序列表 ({{HTMLElement("ul")}}) 或者菜单 ({{HTMLElement("menu")}}) 无效。 + <div class="note"><strong>注：</strong> 这个属性在 HTML 4 中废弃，但是在 HTML 5 中重新引入。</div> + + <div class="note"> + <p><strong>注：</strong> 在 {{Gecko("9.0")}} 之前，负值会错误地转换为 0。{{Gecko("9.0")}} 开始，所有整数值都可以正确解析。</p> + </div> + </dd> + <dt>{{htmlattrdef("type")}} {{Deprecated_inline}}</dt> + <dd>这个字符型属性表明了数字的类型： + <ul> + <li><code>a</code>: 小写字母</li> + <li><code>A</code>: 大写字母</li> + <li><code>i</code>: 小写罗马数字</li> + <li><code>I</code>: 大写罗马数字</li> + <li><code>1</code>: 数字</li> + </ul> + 本属性值将覆盖 {{HTMLElement("ol")}} 元素中的同名属性值（若存在）。 + + <div class="note"><strong>使用注解：</strong> 本属性已废弃：使用 CSS {{cssxref("list-style-type")}} 属性来代替。</div> + </dd> +</dl> + +<h2 id="示例">示例</h2> + +<pre class="brush: html"><ol> + <li>first item</li> + <li>second item</li> + <li>third item</li> +</ol> +</pre> + +<p>上面的 HTML 会输出：</p> + +<ol> + <li>first item</li> + <li>second item</li> + <li>third item</li> +</ol> + +<pre class="brush: html"><ol type="I"> + <li value="3">third item</li> + <li>fourth item</li> + <li>fifth item</li> +</ol> +</pre> + +<p>上面的 HTML 会输出：</p> + +<ol start="3" style="list-style-type: upper-roman;"> + <li>third item</li> + <li>fourth item</li> + <li>fifth item</li> +</ol> + +<pre class="brush: html"><ul> + <li>first item</li> + <li>second item</li> + <li>third item</li> +</ul></pre> + +<ul> + <li>first item</li> + <li>second item</li> + <li>third item</li> +</ul> + +<p>更多具体示例请见 <a href="/en-US/docs/Web/HTML/Element/ol#Examples"><ol></a> 和 <a href="/en-US/docs/Web/HTML/Element/ul#Examples"><ul></a> 页面。</p> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'grouping-content.html#the-li-element', '<li>')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-li-element', '<li>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'lists.html#h-10.2', '<li>')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>The <code>type</code> attribute has been deprecated.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览兼容性">浏览兼容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>其它列表相关的 HTML 元素： {{HTMLElement("ul")}}, {{HTMLElement("li")}}, {{HTMLElement("menu")}}, 和过时的 {{HTMLElement("dir")}}；</li> + <li>可能特定用于排版 <code><li></code> 元素的 CSS 属性： + <ul> + <li>{{cssxref("list-style")}} 属性，用于选择序号的展示方式，</li> + <li><a href="/Web/Guide/CSS/Counters">CSS 计数器</a>，用于处理复杂的嵌套列表，</li> + <li>{{cssxref("margin")}} 属性，用于控制列表条目的缩进。</li> + </ul> + </li> +</ul> + +<div> </div> |