CSS 数据类型 - <display-listitem>

关键字list-item 使元素生成一个具有由list-style 属性指定的內容的::marker伪元素，以及一个为其自身内容指定的类型的主框。

使用list-item 的单个值，元素将表现得像列表项。它可以与list-style-type 和list-style-position 结合使用。

关键字list-item 可以与任何<display-outside> 关键字和<display-inside> 关键字组合使用，例如flow 或flow-root。

注意：支持双值语法的浏览器在未传递内部值时，会将其默认设置为flow。当未传递外部值时，主框将具有块级外部显示类型。

语法

<display-listitem> = <display-outside>? && [ flow | flow-root ]? && list-item

CSS <display-listitem> - list-item

以下示例演示了display: list-item 的用法，其中 div 元素显示为列表值。

<html>
<head>
<style> 
   .sample-list {
      display: list-item;
      list-style-position: inside;
      color: green;
      font-size: 1.5em;
   }
</style>
</head>
<body>
   <h1><display-listitem> data type</h1>

   <div class="sample-list">First list item</div>
   <div class="sample-list">Second list item</div>
</body>
</html>

打印页面