Egenskaben list-style-type

Egenskaben list-style-type tillader for listen ul i stedet for punktmærker at lave firkanter eller cirkler. For listen ol i stedet for almindelige tal kan man lave romerske, numre i form af bogstaver: latinske eller græske.

Syntaks

selektor {
	list-style-type: værdi;
}

Værdier for ul

Værdi	Beskrivelse
`circle`	Opretter mærker i form af cirkler.
`disc`	Opretter mærker i form af udfyldte cirkler.
`square`	Opretter mærker i form af firkanter.
`none`	Fjerner mærker.

Standardværdi: disc.

Værdier for ol

Værdi	Beskrivelse
`armenian`	Traditionel armensk nummerering.
`decimal`	Arabiske tal.
`decimal-leading-zero`	Arabiske tal med nul foran for tal mindre end ti.
`georgian`	Traditionel georgisk nummerering.
`lower-alpha`	Små latinske bogstaver.
`lower-greek`	Små græske bogstaver.
`lower-latin`	Denne værdi er analog med lower-alpha.
`lower-roman`	Romerske tal med små bogstaver.
`upper-alpha`	Store latinske bogstaver.
`upper-latin`	Denne værdi er analog med upper-alpha.
`upper-roman`	Romerske tal med store bogstaver.
`none`	Fjerner mærker.

Standardværdi: decimal.

Eksempel

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

ul {
	list-style-type: disc;
}

Eksempel

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

ul {
	list-style-type: circle;
}

Eksempel

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

ul {
	list-style-type: square;
}

Eksempel

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

ul {
	list-style-type: none;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: decimal;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: armenian;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: decimal-leading-zero;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: georgian;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: lower-alpha;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: lower-greek;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: lower-latin;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: lower-roman;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: upper-alpha;
}

Eksempel

<ol>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ol>

ol {
	list-style-type: upper-roman;
}

Eksempel

Dette eksempel viser, at egenskaben color påvirker ikke kun tekstens farve, men også mærkernes farve:

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

ul {
	list-style-type: disc;
	color: red;
}

Se også

egenskaben list-style-image,
som indstiller mærker i form af specificerede billeder
egenskaben list-style-position,
som indstiller mærkernes position
egenskaben list-style,
som er en forkortelse for mærker