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>

列印頁面