Liste à puce et liens visités

Bonsoir,

J’ai un forum phpbb. J’utilise un script qui me permet d'afficher les derniers messages du forum sur ma page d'accueil.
Le script m’affiche une liste des derniers discussions ayant reçus un nouveau message avec :

- Le titre de la discussion qui contient le lien vers la dernière discussion.
- Le nom du dernier posteur (sans lien)
- La date et l’heur du dernier message (sans lien)

Maintenant J’aimerais styler un peut cette liste en utilisant le css de telle façon que :

1) les derniers messages doivent être affichés sous forme de liste à puce. Cette puce est sous forme d’une image gif.
2) que lorsque quelqu'un clique sur cette liste. Cette la première image sera replacée par une autre image (permettant au lecteur de savoir qu’il à visité ce lien).

Comment réaliser cette procédure en utilisant les listes à puce en css ?
Merci d’avance.
Modifié par naman (05 Sep 2007 - 17:27)

up...

j'ai réussi a afficher les derniers messages sous forme de liste a puce .

me reste le problème du changement de la puce lorsque un lien est cliqué (avec la balise a:visited )

comment faire ?

Si tu veux pouvoir changer la puce en fonction de l'état du lien, il faut remplacer la puce par une image de fond dans ton lien. Tu pourras ensuite la changer pour ton a:visited.

voila ce que j'ai fait :

.last-post lu{
 font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
 font-size: 10px;
 list-style:none;
 }


.last-post li {
 font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
 font-size: 10px;
 color: black;
 list-style-type:none;
 background-repeat:no-repeat;
 background-position:0% 65%;
 padding-left:15px;
} 

.last-post li a{
 font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
 font-size: 11px;
 color:#47C639;
 list-style-type:none; background-image:url(arrow-blue2.gif);
 background-repeat:no-repeat;
 background-position:0% 65%;
 padding-left:15px;
 font-weight:bold;
} 

.last-post li a:visited {

 font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
 font-size: 11px;
 color:#47C639;
 list-style-type:none; background-image:url(ok.png);
 background-repeat:no-repeat;
 background-position:0% 65%;
 padding-left:15px;
font-weight:bold;
 }

résultat:il marche bien sur firefox , mais sous internet exploreur 6 j'ai un décalage énorme entre les titres : http://www.discussion-diagnostique.com/ind.php

Ok probléme réglé !