Als je witt tekst op een zwarte achtergrond plaatst in HTML en je gebruikt een list:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
dan worden de bullets automatisch zwart.
Er is geen liststyle om de bullets een andere kleur te geven?
De enige optie is dan om een plaatje te gebruiken?
-
22-03-2021, 19:13 #1
DaMedia
- Berichten
- 2.299
- Lid sinds
- 16 Jaar
liststyle
-
In de schijnwerper
-
22-03-2021, 19:28 #2
Particulier
- Berichten
- 390
- Lid sinds
- 15 Jaar
Re: liststyle
Er zijn meerdere mogelijkheden. Je kunt bijvoorbeeld de list items de kleur geven die je wilt hebben voor de bullets en dan een <span> om de tekst zelf plaatsen met een andere kleur.
Code:<html> <head> <style> li {color: red;} li > span {color: black;} </style> </head> <body> <ul> <li><span>Coffee</span></li> <li><span>Tea</span></li> <li><span>Milk</span></li> </ul> </body> </html>Laatst aangepast door Tjerk de Heer : 22-03-2021 om 19:34
-
23-03-2021, 08:39 #3
Webblish Content & Publishing
- Berichten
- 5.661
- Lid sinds
- 18 Jaar
Re: liststyle
Op deze manier hoef je de HTML niet aan te passen en kun je de bullet eventueel ook door heel veel andere symbolen vervangen: https://www.w3.org/Style/Examples/00...ullets.en.html
-
23-03-2021, 09:30 #4
Particulier
- Berichten
- 691
- Lid sinds
- 15 Jaar
Re: liststyle
https://caniuse.com/?search=CSS%20%3...pseudo-element
Code:li::marker { color: red; }
