nicht angemeldet
Farbe von Bulletpunkten
0 0 
Gunnar Bittersmann
0 
Der Martin
Farbe von Bulletpunkten
Hallo,
Wie kann ich lediglich die Farbe der Bulletpunkte in einer <ul>-Liste ändern?
Ich möchte die Farbe des Textes hinter den Bulletpunkten unverändert lassen.
-----
<ul>
<li style="list-style-type:square;">Text hinter einem Bulletpunkt</li>
</ul>
-----
Danke!
-
Hallo Gunter.
Wie kann ich lediglich die Farbe der Bulletpunkte in einer <ul>-Liste ändern?
Auf direktem Wege leider gar nicht. Dir bleibt die Möglichkeit, <http://de.selfhtml.org/css/eigenschaften/listen.htm#list_style_image@title=eine eigene Grafik als Bulletzeichen> zu verwenden.
Einen schönen Dienstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Hi,
Danke.
Dachte ich mir (fast) schon... Bleibt wohl nur noch
<p style="margin-left:18.0pt; text-indent:-18.0pt;"><span style="color:#4D4D4D;">▶</span> yada yada</p>
als andere Möglichkeit, oder?-G
-
<p style="margin-left:18.0pt; text-indent:-18.0pt;"><span style="color:#4D4D4D;">▶</span> yada yada</p>
Gibt's da nicht auch eine "todsicherere" Methode, den linken Textrand für den Text "yada yada..." auszurichten?
Die Methode scheint mir nicht besonders clever...-
Hallo Gunter.
<p style="margin-left:18.0pt; text-indent:-18.0pt;"><span style="color:#4D4D4D;">▶</span> yada yada</p>
Gibt's da nicht auch eine "todsicherere" Methode, den linken Textrand für den Text "yada yada..." auszurichten?
Die Methode scheint mir nicht besonders clever...Und auch gänzlich unnötig. Hier genügt bereits http://de.selfhtml.org/css/eigenschaften/randabstand.htm#margin_right@title=margin-right für das span-Element.
Und überhaupt solltest du auf Inline-Styles verzichten, da sie jeglichen Nutzen von CSS gegenüber den veralteten Gestaltungsattributen zunichte machen. (Sollten sie hier nur zur Demonstration dienen, kannst du diesen Hinweis hier getrost ignorieren.)
Einen schönen Dienstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Und auch gänzlich unnötig. Hier genügt bereits http://de.selfhtml.org/css/eigenschaften/randabstand.htm#margin_right@title=margin-right für das span-Element.
Danke.
[...] (Sollten sie hier nur zur Demonstration dienen, kannst du diesen Hinweis hier getrost ignorieren.)
Getan!
-
Hello out there!
Und überhaupt solltest du auf Inline-Styles verzichten, da sie jeglichen Nutzen von CSS gegenüber den veralteten Gestaltungsattributen zunichte machen.
Full ACK.
(Sollten sie hier nur zur Demonstration dienen, kannst du diesen Hinweis hier getrost ignorieren.)
NAK. Auch in Postings hier im Forum ist die Trennung von HTML und CSS viel übersichtlicher und erleichtert die Hilfe.
See ya up the road,
Gunnar--
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
-
-
-
-
-
Hello out there!
Hier gleich die Antwort auf beide deiner Fragen:
Ich möchte für eine <ul>-Liste andere Bulletpunktzeichen verwenden als die, die fest vorgegeben sind (disc, circle, square etc.).
Kann ich dafür jedes beliebige Zeichen z. B. ⃣ benutzen und wie kann ich das in CSS umsetzen?Die Verwendung der dezimalen Angabe ist IMHO unsinnig; man muss immer erst umrechnen, um zu wissen, um welches Zeichen es sich handelt, da die Unicode-Charts nur hexadezimale Angaben verwenden.
Die Zahl war aber auch nur ein Schuss ins Blaue, oder? U+20E3 combining enclosing keycap dürfte als Bulletzeichen nicht verwendbar sein.
Und in CSS benötigst du auch die hexadezimale Angabe.
9654 in deinem anderen Posting sieht da schon besser aus: U+25B6 black right-pointing triangle.
Wie kann ich lediglich die Farbe der Bulletpunkte in einer <ul>-Liste ändern?
Ich möchte die Farbe des Textes hinter den Bulletpunkten unverändert lassen.Dazu müssten Bullet und Listitem-Text unterschiedliche (Pseudo-)Elemente sein.
Also das vorhandene Bulletzeichen entfernen und durch ein eigenes ersetzen:
ul { list-style-type: none; } li { text-indent: -0.9em; } li::before { color: red; content: "\25B6 \A0"; }Wenn du UTF-8 als Codierung verwendest, solle es mit einem Unicode-fähigen Editor auch so gehen:
li::before { color: red; content: "▶\A0"; }Wenn das Stylesheey in einer externen Datei steht, muss die Codierung am Anfang angegeben werden:
@charset "UTF-8";Alte IEs kennen das
::before-Pseudoelement nicht, vor diesen wäre das also mittels conditional comments oder 'html>body' zu verstecken. IE-Nutzer kommen dann nicht in den Genuss der anderen, andersfarbigen Bullets, aber die wollen das so. [tm]See ya up the road,
Gunnar--
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)-
Hallo Gunnar.
Wenn das Stylesheey in einer externen Datei steht, muss die Codierung am Anfang angegeben werden:
@charset "UTF-8";Hm, ist das wirklich erforderlich?
Ich habe diese at-Regel noch nie irgendwo verwendet, dafür aber mehrfach UTF-8-kodierte Zeichen, welche auch alle korrekt angezeigt werden. (Natürlich alles ohne BOM.)Einen schönen Dienstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Hello out there!
Wenn das Stylesheey in einer externen Datei steht, muss die Codierung am Anfang angegeben werden:
@charset "UTF-8";Hm, ist das wirklich erforderlich?
Hast Recht, ist es nicht, wenn der Server auch für CSS im HTTP-Header 'UTF-8' angibt oder das HTML-Dokument in UTF-8 codiert ist. [CSS21 §4.4]
See ya up the road,
Gunnar--
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
-
-
-
Hallo Gunter,
Wie kann ich lediglich die Farbe der Bulletpunkte in einer <ul>-Liste ändern? Ich möchte die Farbe des Textes hinter den Bulletpunkten unverändert lassen.
eigentlich ganz einfach, du brauchst nur ein zusätzliches Element innerhalb der li-Elemente. Wenn da nicht sowieso schon eines ist (etwa ein a-Element), würde sich ein span anbieten.
<style type="text/css">
li
{ color: farbe_der_bullets;
}
li span
{ color: farbe_des_texts;
}
</style>[...]
<ul>
<li><span>Aufzählungspunkt</span></li>
<li><span>Aufzählungspunkt</span></li>
<li><span>Aufzählungspunkt</span></li>
</ul>Schönen Tag noch,
Martin--
Frauen sind wie Elektrizität: Fasst man sie an, kriegt man eine gewischt.-
Hello out there!
eigentlich ganz einfach, du brauchst nur ein zusätzliches Element innerhalb der li-Elemente.
Verstehe ich dich richtig? Du willst der Darstellung wegen nachträglich am Markup herumpfuschen? Ts ts ... Ja sind wir den hier im Zen Garden?
See ya up the road,
Gunnar--
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
-