{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)