Punktopstillings tegn

Artikler, Tips og tricks
→	CSS (8 Artikler)
→	HTML (11 Artikler)
→	JS (7 Artikler)
→	PERL (1 Artikler)
→	PHP (3 Artikler)
→	APACHE (8 Artikler)
→	COMPUTER (2 Artikler)
→	LINUX (2 Artikler)
→	MICROSOFT (7 Artikler)
→	SIKKERHED (6 Artikler)
→	WEBDESIGN (5 Artikler)
→	DIVERSE (8 Artikler)

Tutorials
→	CSS (18 Lektioner)
→	HTML (15 Lektioner)
→	JS (8 Lektioner)
→	PERL (12 Lektioner)
→	PHP (6 Lektioner)
→	SQL (8 Lektioner)
→	SSI (7 Lektioner)
→	XHTML (5 Lektioner)

Tools
→	.htaccess generator
→	Iframe generator
→	"Krypter" din e-mail
→	Meta-tag generator
→	Webcolor
→	.... flere

Service
→	Software
→	Links
→	Dokumentation
→	Nyhedsgrupper
→	Downloads
→	Virus info
→	Seneste IT nyheder
→	.... flere
→	Alt om NETeXplorer

Reklame

HOME -> CSS_ARTIKLER -> 04-css	Søndag, 5. Februar 2012

Offentliggjort 2002 - Opdateret n/a

Punktopstillings tegn

Forskellige farver for punktopstillings tegn.

Det er mulig at ændre punktopstillingens tegn på forskellig måde. De små punkttegn eller bullets kan erstattes af andre tegn og farver.
Når man anvender <li> tagen, vil punkttegnet blive samme farve som den efterfølgende tekst. For at ændre dette deler vi punkttegnet og teksten op hver for sig. Til dette anvender vi <div> tagen.

<ul>
  <li style="color : red"><div style="color : black">Element 1</div></li>
  <li style="color : green"><div style="color : black">Element 2</div></li>
  <li style="color : blue"><div style="color : black">Element 3</div></li>
</ul>

Samme princip kan selvfølgelig også anvendes med "ringe" (cirkle) eller "kasser" (square) som punktopstillings tegn.

<ul type="circle">
  <li style="color : red;"><div style="color : black">Element 1</div></li>
  <li style="color : green"><div style="color : black">Element 2</div></li>
  <li style="color : blue"><div style="color : black">Element 3</div></li>
</ul>

<ul type="square">
  <li style="color : red;"><div style="color : black">Element 1</div></li>
  <li style="color : green"><div style="color : black">Element 2</div></li>
  <li style="color : blue"><div style="color : black">Element 3</div></li>
</ul>