files/pt-pt/web/css/list-style/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79

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

<h2 id="Resumo" name="Resumo">Resumo</h2>

<p>A propriedade <code>list-style</code> é uma propriedade usada para configurar list-style-type, list-style-image, e list-style-position.</p>

<ul>
 <li>Valor inicial: olhar propriedades individuais para detalhes</li>
 <li>Aplica-se a: elementos com 'display' com valor 'list-item'</li>
 <li>Herdado: sim</li>
 <li>Porcentagens: N/A</li>
 <li>Mídia: <a href="pt/CSS/Media/Visual">Visual</a></li>
</ul>

<h2 id="Sintaxe" name="Sintaxe">Sintaxe</h2>

<pre class="eval"> list-style: [disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none] || [inside | outside] || [&lt;url&gt; | none]
</pre>

<h2 id="Valores" name="Valores">Valores</h2>

<p>disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha, inside, outside, &lt;url&gt;, none</p>

<h2 id="Exemplos">Exemplos</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="Result">Result</h3>

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

<h2 id="Especifica.C3.A7.C3.B5es" name="Especifica.C3.A7.C3.B5es">Especificações</h2>

<ul>
 <li><a class="external" href="http://www.w3.org/TR/CSS1#list-style">CSS 1</a></li>
</ul>

<p><span class="comment">* {{ mediawiki.external('http://www.w3.org/TR/CSS21/visudet.html#the-height-property CSS 2.1') }} == Compatibilidade com navegadores == &lt;table class="standard-table"&gt; &lt;tr&gt; &lt;th&gt;Navegador&lt;/th&gt; &lt;th&gt;Versão mais antiga&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Internet Explorer&lt;/td&gt; &lt;td&gt;4&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Netscape&lt;/td&gt; &lt;td&gt;4&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Opera&lt;/td&gt; &lt;td&gt;3.5&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt;</span></p>

<h2 id="Veja_tamb.C3.A9m" name="Veja_tamb.C3.A9m">Veja também</h2>

<p><a href="pt/CSS/box_model">list-style-image</a>, {{ Cssxref("list-style-type") }}, {{ Cssxref("list-style-position") }}</p>

<p><span class="comment">Categorias</span></p>

<p><span class="comment">Interwiki Language Links</span></p>

<p>{{ languages( { "en": "en/CSS/list-style", "fr": "fr/CSS/list-style" } ) }}</p>