Forum: Offtopic XHTML Aufzählung mit farbigen Zahlen


von Joe M. (jumper)


Lesenswert?

Eine aufzählung in XHTML geht ja so,
<ol>
  <li> hallo</li>
  <li> hallo</li>
</ol>

Wie mache ich jedoch die zahlen grün??

Gruß

von Uhu U. (uhu)


Lesenswert?

Versuchs mal so:

<ol>
  <li> hallo</li>
  <li style="color: green"> hallo</li>
</ol>

von Läubi .. (laeubi) Benutzerseite


Lesenswert?

Besser mit css:
1
ol li {
2
  color: green;
3
}
Dann ist aber auch der Text grün! Wenn du nur die Zahlen willst, müßte 
man ggf den text in ein span einschließen und dort die Farbe wieder auf 
schwarz stellen.
1
ol li {
2
  color: green;
3
}
4
ol li span {
5
  color: black;
6
}

von Joe M. (jumper)


Lesenswert?

Das mit
ol li {
  color: green;
}
ol li span {
  color: black;
}
Funktioniert leider nicht,(vieleicht mach ich auch einen fehler),
Für den kompleten Quelltext wäre ich dankbar!

Ich will nur die Zahlen farbig haben!
Gruß Joe

von El Patron B. (bastihh)


Lesenswert?

1
<ol style="color:#00FF00;">
2
   <li><font style="color:#000000;">hallo </font></li>
3
   <li><font style="color:#000000;">hallo </font></li>
4
</ol>

Besser du legst dir eine CSS Datei an mit den jeweiligen Klassen.

Wird übersichtlicher.

Grüße

[edit]

So zB:

Zwischen dem Headtag (<head> </head>) trägst du ein:
1
<style type="text/css">
2
.zahlen
3
  {
4
    color:#00FF00;
5
  }
6
.text
7
  {
8
    color:#000000;
9
  }
10
</style>

Dann im Body Bereich (zwischen <body> </body>)
1
<ol class="zahlen">
2
   <li><font class="text">hallo </font></li>
3
   <li><font class="text">hallo </font></li>
4
</ol>

von Joe M. (jumper)


Lesenswert?

Danke!

von Läubi .. (laeubi) Benutzerseite


Lesenswert?

font ist aber deprecated, statt dessen lieber wie schon gesagt span 
verwenden. Außerdem kann man sich die ganzen Klassen sparen, wenn reicht 
es eine klasse für ol zu vergeben falls man verschiedene 
Auszeichnungen haben will... der Witz an css ist doch gerade das man 
seinen HTMLcode eben nicht mehr mit haufenweise Style und 
Formatierangaben übersäht...

Minimalbeispiel:
1
<html>
2
<head>
3
<style type="text/css">
4
ol li {
5
  color: green;
6
}
7
ol li span {
8
  color: black;
9
}
10
</style>
11
12
</head>
13
<body>
14
<ol>
15
  <li><span>hallo</span></li>
16
  <li><span>hallo</span></li>
17
</ol>
18
</body>
19
</html>

von Johnny B. (johnnyb)


Lesenswert?

Läubi .. schrieb:
> Besser mit css:
>
> ol li {
>
>   color: green;
>
> }

Das hier "<li style="color: green"> hallo</li>" ist auch CSS, einfach 
inline...

Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.