---
title: list-style
slug: Web/CSS/list-style
tags:
  - CSS
  - CSS Referenz
translation_of: Web/CSS/list-style
---
<p>{{ CSSRef() }}</p>

<h2 id="Übersicht">Übersicht</h2>

<p>Die <code>list-style</code> Eigenschaft ist eine Kurzform für {{cssxref("list-style-type")}}, {{cssxref("list-style-image")}}  und {{cssxref("list-style-position")}}.</p>

<p>{{cssinfo}}</p>

<h2 id="Syntax">Syntax</h2>

<pre class="eval">list-style: [ list-style-type || list-style-position || list-style-image ] | inherit
</pre>

<h3 id="Werte">Werte</h3>

<dl>
 <dt>list-style-type</dt>
 <dd>Siehe  {{cssxref("list-style-type")}}</dd>
 <dt>list-style-image</dt>
 <dd>Siehe  {{cssxref("list-style-image")}}</dd>
 <dt>list-style-position</dt>
 <dd>Siehe  {{cssxref("list-style-position")}}</dd>
</dl>

<h2 id="Beispiele">Beispiele</h2>

<h3 id="HTML">HTML</h3>

<pre class="brush: html">List 1
&lt;ul class="one"&gt;
  &lt;li&gt;List Item1&lt;/li&gt;
  &lt;li&gt;List Item2&lt;/li&gt;
  &lt;li&gt;List Item3&lt;/li&gt;
&lt;/ul&gt;
List 2
&lt;ul class="two"&gt;
  &lt;li&gt;List Item A&lt;/li&gt;
  &lt;li&gt;List Item B&lt;/li&gt;
  &lt;li&gt;List Item C&lt;/li&gt;
&lt;/ul&gt;
</pre>

<h3 id="CSS">CSS</h3>

<pre class="brush: css">.one {
  list-style: circle;
}

.two {
  list-style: square inside;
}</pre>

<h3 id="Ergebnis">Ergebnis</h3>

<p>{{EmbedLiveSample('Beispiele')}}</p>

<h2 id="Browser_Kompatibilität">Browser Kompatibilität</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th>Browser</th>
   <th>ab Version</th>
  </tr>
  <tr>
   <td>Internet Explorer</td>
   <td>4.0</td>
  </tr>
  <tr>
   <td>Firefox (Gecko)</td>
   <td>1.0 (1.0)</td>
  </tr>
  <tr>
   <td>Opera</td>
   <td>3.5</td>
  </tr>
  <tr>
   <td>Safari (WebKit)</td>
   <td>1.0 (85)</td>
  </tr>
 </tbody>
</table>

<h2 id="Spezifikation">Spezifikation</h2>

<ul>
 <li><a href="http://www.w3.org/TR/CSS21/generate.html#propdef-list-style">CSS 2.1 Generated content #list-style</a></li>
</ul>

<h2 id="Siehe_auch">Siehe auch</h2>

<ul>
 <li>{{cssxref("list-style-type")}}, {{cssxref("list-style-image")}}, {{cssxref("list-style-position")}}</li>
</ul>

<div class="noinclude">{{ languages({ "en": "en/CSS/list-style", "es": "es/CSS/list-style", "fr": "fr/CSS/list-style", "ja": "ja/CSS/list-style", "pl": "pl/CSS/list-style", "pt": "pt/CSS/list-style"}) }}</div>