{HTML/CSS} Liste HTML au format "Lien1 | Lien2 | Lien3" mise en forme en CSS

Logiciel & apps Programmation
1

Salut :slight_smile:

Je, pour un site Internet, souhaite faire un menu qui aurait la forme suivante : Lien1 | Lien2 | Lien3
J’ai donc fait une liste HTML (un

    et des
  • ) mise en forme en CSS qui place les
  • en ligne (voir ce tutoriel).

    <ul>
	<li>Lien1</li>
	<li>Lien2</li>
	<li>Lien3</li>
</ul>

    Seulement voilà, pour le moment j’ai : « Lien1 Lien2 Lien3 »
    Pas de séparateur « | » donc. Comment faire pour avoir ce caractère de séparation entre chaque

  • ?
    Edité le 02/12/2007 à 12:32

2

Osef d’IE?

Si oui :

ul li::after {content: ’ | ';}
ul li:first-child::after {content: ‹  › !important;}

A tester. Je sais jamais si « :: » c’est pour les pseudo éléments (:first-child), ou les pseudo classes (::after).

3

:oui: totalement

Merci ça marche nickel :super:

(Il a juste fallut que je remplace « first-child » par « last-child » : sinon la première paire n’avait pas de « | » et il y en avait un en trop à la fin de la liste)

ul li::after {
	content: ' |';
}

ul li:last-child::after  {
	content: '' !important;
}

Sans-Nom :jap:

4

::before sinon :slight_smile:

5

Oui c’était (logiquement) l’autre possibilité, mais ça faisait plus de caractère à taper (6 caractères à deux endroits contre 2 -la- qui en remplacent 3 -fir-) :ane:

(C’est une joke hein… Je le précise pour que le cliché du programmeur fainéant ne se répande pas trop)