Bouton de navigation sans images

Voir le sujet précédent Voir le sujet suivant Aller en bas

phpBB3 Bouton de navigation sans images

Message par Ajesto le Ven 20 Jan - 19:08

Bonjour,

J'ai créer des boutons de navigation sans aucune images, je ne sais pas si c'est compatible autre que phpBB3.
Voici donc les différents thèmes :

Thème bleu:


Le CSS a appliquer:

Code:
.navbar .corners-top, .navbar .corners-bottom { display: none; } /* J'enlève les corners */
.navbar { background-color: transparent; height: 40px; } /* Fond de la barre de navigation */
.navbar ul.linklist.navlinks { text-align: center; border: 0; font-size: 0; } /* Je centre les liens, enlève l'espace entre les liens */
#search-box { display: none; } /* J'enlève la barre de recherche */
.navbar ul.linklist li img { display: none; } /* J'enlève les images de la barre de navigation */
.navbar ul.linklist li a { color: white; height: 40px; display: inline-block; line-height: 38px; padding-left: 10px; padding-right: 10px; text-decoration: none !important; font-size: 11px; border: 4px solid black; margin-right: 10px; border-radius: 15px; background-color: #1b6ee6; box-shadow: inset 0 0 20px 8px #539aff; } /* Liens */

Thème bleu (inversé):


Le CSS a appliquer:

Code:
.navbar .corners-top, .navbar .corners-bottom { display: none; } /* J'enlève les corners */
.navbar { background-color: transparent; height: 40px; } /* Fond de la barre de navigation */
.navbar ul.linklist.navlinks { text-align: center; border: 0; font-size: 0; } /* Je centre les liens, enlève l'espace entre les liens */
#search-box { display: none; } /* J'enlève la barre de recherche */
.navbar ul.linklist li img { display: none; } /* J'enlève les images de la barre de navigation */
.navbar ul.linklist li a { color: white; height: 40px; display: inline-block; line-height: 38px; padding-left: 10px; padding-right: 10px; text-decoration: none !important; font-size: 11px; border: 4px solid black; margin-right: 10px; border-radius: 15px; background-color: #539aff; box-shadow: inset 0 0 20px 8px #1b6ee6; } /* Liens */

Thème rouge:


Le CSS a appliquer:

Code:
.navbar .corners-top, .navbar .corners-bottom { display: none; } /* J'enlève les corners */
.navbar { background-color: transparent; height: 40px; } /* Fond de la barre de navigation */
.navbar ul.linklist.navlinks { text-align: center; border: 0; font-size: 0; } /* Je centre les liens, enlève l'espace entre les liens */
#search-box { display: none; } /* J'enlève la barre de recherche */
.navbar ul.linklist li img { display: none; } /* J'enlève les images de la barre de navigation */
.navbar ul.linklist li a { color: white; height: 40px; display: inline-block; line-height: 38px; padding-left: 10px; padding-right: 10px; text-decoration: none !important; font-size: 11px; border: 4px solid black; margin-right: 10px; border-radius: 15px; background-color: #a93535; box-shadow: inset 0 0 20px 8px #ff5353; } /* Liens */

Thème rouge (inversé:


Le CSS a appliquer:

Code:
.navbar .corners-top, .navbar .corners-bottom { display: none; } /* J'enlève les corners */
.navbar { background-color: transparent; height: 40px; } /* Fond de la barre de navigation */
.navbar ul.linklist.navlinks { text-align: center; border: 0; font-size: 0; } /* Je centre les liens, enlève l'espace entre les liens */
#search-box { display: none; } /* J'enlève la barre de recherche */
.navbar ul.linklist li img { display: none; } /* J'enlève les images de la barre de navigation */
.navbar ul.linklist li a { color: white; height: 40px; display: inline-block; line-height: 38px; padding-left: 10px; padding-right: 10px; text-decoration: none !important; font-size: 11px; border: 4px solid black; margin-right: 10px; border-radius: 15px; background-color: #ff5353; box-shadow: inset 0 0 20px 8px #a93535; } /* Liens */

Pour appliquer du CSS sur votre forum, allez dans

Affichage

Images et Couleurs

Couleurs

Feuille de style CSS



Les thèmes fonctionnent même avec des liens ajoutés. Il s'adaptent à tout.
Merci d'avoir vu mon Libre-Service,
Laiorm


Dernière édition par Laiorm le Ven 20 Jan - 21:09, édité 7 fois (Raison : Mise à jour (Publication))


avatar
Ajesto
Fondateur
Fondateur

Messages : 115 Masculin Points : 3

Voir le profil de l'utilisateur

Revenir en haut Aller en bas

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum