<display-listitem>

list-item キーワードは、要素に list-style プロパティで指定された内容 (例えば見出し記号) を含む ::marker 擬似要素と共に、自身の内容物のために指定された種類の基本的なボックスを生成します。

構文

list-item 単独の値を指定すると、要素はリスト項目のように動作します。これは list-style-typelist-style-position と共に使用することができます。

list-item<display-outside> キーワードのいずれかと、 <display-inside>flow または flow-root キーワードと組み合わせることもできます。

メモ: 二つの値の構文に対応しているブラウザーでは、内部表示種別がないと既定で flow になります。外部表示種別が指定されないと、基本ボックスは外部表示種別が block になります。

HTML

html
<div class="fake-list">I will display as a list item</div>

CSS

css
.fake-list {
  display: list-item;
  list-style-position: inside;
}

結果

仕様書

Specification
CSS Display Module Level 3
# typedef-display-listitem

ブラウザーの互換性

list-item の対応

BCD tables only load in the browser

関連情報