Comment réalisez-vous ce type de menu:
à propos de | Confidentialité | Contact | Carte du site
... Un menu séparé par une barre verticale, mais le premier et le dernier élément ne dispose pas d'une barre sur les côtés gauche et droit (comme indiqué dans l'exemple)?
Les éléments de menu sont générés dynamiquement (utilisés dans WordPress), pas manuellement.
Merci.
4 Réponses :
La barre verticale n'est qu'un caractère sur le clavier, vous pouvez donc la saisir entre les mots.
Merci. Cependant, les éléments de menu sont générés dynamiquement (utilisés dans WordPress), non manuellement.
Ok, j'ai mis cette information dans la question.
Si vous utilisez des éléments de liste comme point de repère pour votre navigation, vous pouvez afficher une ligne entre chaque lien en créant le séparateur comme une image de fond Le truc pour que cela ne puisse apparaître que entre les éléments de la liste consiste à positionner l'image à gauche du ce CSS ajoute l'image à chaque élément de liste qui suit un autre élément de la liste - en d'autres termes tous mais le premier. p> Alternativement strong> Vous pouvez utiliser la propriété CSS li code> . Li code>, mais pas sur le premier. Cet exemple utilise le sélecteur adjacent em>: p> Content code> avec le avant code> pseudo classe, au lieu d'une image . Le code suivant ajoute un tuyau avant vos liens de navigation (à nouveau à l'aide du sélecteur adjacent). P> #nav li + li a:before {
content: "|";
}
Je vois, je vais prendre note de cela. Mais y a-t-il un moyen de ne pas faire cela en utilisant des images d'arrière-plan? Est-ce que l'APPUT AVANT OU APRÈS CSS a de l'aide? Je vais utiliser le menu dans un menu WordPress, les éléments de menu sont donc générés de manière dynamique.
J'ai mis à jour la réponse à inclure cette approche alternative, bien que personnellement, je trouve en utilisant une image d'arrière-plan plus flexible.
+1 si frontière-droite: solide 1px # 000 au lieu de en arrière-plan dans la première déclaration CSS peut raser une demande HTTP pour obtenir le même effet si un caractère de tuyau ou Lookalike est tout ce qui est nécessaire (sans les problèmes de compatibilité potentielles posés par la deuxième méthode)
Merci, la deuxième méthode fonctionne pour l'instant. Bien que la barre verticale soit incluse et "surlignée" lorsque le lien est planifié, mais la méthode fonctionne bien pour le moment. Explorera à l'aide d'images d'arrière-plan plus tard.
a trouvé une solution plus facile pour WordPress!
Allez juste à l'apparence> Menus et ajoutez " |" À la fin de l'étiquette de navigation pour chaque titre du menu !!
Je pense que la meilleure façon de le faire est avec une classe CSS.
apparence → menus: http://d.pr/i/i9ko+
ajoutez une classe de "dernier" à votre dernier élément de menu Ensuite, dans votre style.CSS, ajoutez:
#nav li.last span {
Affichage: Aucun;
}