Beste,
Het is een oud topic maar gaat over hetzelfde dus ik plaats het er liever onder dan dat ik een nieuw topic aan maak.
Alles wat ik eerder wou weten is gelukt. Allen bedankt daarvoor!
Mijn volgende vraag is of ik de tekst niet automatisch zwart kan maken. Wanneer ik in CSS de li een kleur geef (bijvoorbeeld geel) dan wordt de tekst ook geel. Ik wil (zonder span) dat de bol geel blijft maar de tekst zwart. Kan dit zonder dat ik bij alle lijsten nu een span meegeef voor de tekst?
Ik heb best veel lijsten en volgens mij moet het met CSS wel kunnen maar ik kan er niets over vinden.
Ik wil dus het onderstaande maar dan zonder dat ik telkens <span class="blacktext"> moet toevoegen bij elke lijst. Iemand een goed CSS idee?
Bedankt!Code:<html> <head> <style type="text/css"> LI.list1 {list-style: circle outside; color:green;} .blacktext {color:black} </style> </head> <body> <ul> <li class="list1"><span class="blacktext">This is one black line</span> </ul> </body> </html>
-
05-08-2010, 11:47 #16
Particulier
- Berichten
- 940
- Lid sinds
- 16 Jaar
-
05-08-2010, 19:58 #17
Particulier
- Berichten
- 691
- Lid sinds
- 15 Jaar
Dat is alleen mogelijk met een grafische bullet;
list-style-image: url(bullet.png);
-
10-08-2010, 20:38 #18
Particulier
- Berichten
- 336
- Lid sinds
- 17 Jaar
In plaats van achtergrond kan je ook het gene genaamd list-image gebruiken. Dan kan je specialle bolletjes of icoontjes die je voor je li wil hebbe nstaan in plaats van bolletjes etcetera opslaan als afbeelding en die dan gebruiken als list-image.
-
10-08-2010, 21:08 #19
DaMedia
- Berichten
- 2.299
- Lid sinds
- 16 Jaar
Als ik met een achtergrond plaatje werk krijg ik de tekst op de rand van het plaatje aan de linkerkant (omdat ik text-align: left; heb).
Hoe kan ik de tekst verder naar rechts laten springen dan het begin van het plaatje. Met margin en padding lukt allen de knop en de tekst.
Ik wil het plaatje op margin-left: 20px; laten beginnen, de tekst op margin-left: 30px;
Hoe doe ik dat?
-
10-08-2010, 21:26 #20
Vexion
- Berichten
- 658
- Lid sinds
- 18 Jaar
Iets van het volgende zou moeten werken (ik maak dan geen gebruik van list-style-image zodat ik de positie van de achtergrond eenvoudig kan meegeven).
Origineel gepost door J. Haan
PHP Code:ul,li{
margin: 0px;
padding: 0px;
list-style-type:none;
text-align: left;
}
li {
background:url(plaatje.png) 20px no-repeat;
padding-left: 30px;
}
Laatst aangepast door Lodewijk d.V. : 10-08-2010 om 21:36
-
10-08-2010, 22:01 #21
DaMedia
- Berichten
- 2.299
- Lid sinds
- 16 Jaar
Lodewijk, bedankt.
Ik was inmiddels zelf al iets verder.
Probleem zat o.a. in background waar ik background-image had. Toen werkte de no-repeat niet waardoor ik steeds een herhalend plaatje kreeg. Nu het plaatje niet herhaald komt de tekst goed.
Ik zocht de fout in margin en padding, zit het dus in de background.
