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

構文

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

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

HTML

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

CSS

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

結果

ブラウザーの対応

list-item の対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung Internet
基本対応Chrome 完全対応 1Edge 完全対応 12Firefox 完全対応 1IE 完全対応 6Opera 完全対応 7Safari 完全対応 1WebView Android 完全対応 ありChrome Android 完全対応 ありEdge Mobile 完全対応 12Firefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応

ドキュメントのタグと貢献者

このページの貢献者: mfuji09
最終更新者: mfuji09,