Modèle:Boîte déroulante

{{{titre}}}

{{{contenu}}}

Modèle:Documentation modèle compliqué en sous-page

Cette documentation concerne

le modèle {{Boîte déroulante}}
le modèle {{Boîte déroulante/début}} (qui s’utilise avec {{Boîte déroulante/fin}}) et permet de mettre un contenu plus varié.

Recommandations (voir Aide:Boîte déroulante et autres modèles déroulants) :

Limiter l’utilisation de boîtes déroulantes
Ne pas utiliser de boîte déroulante à l’intérieur d’une boîte déroulante
Utiliser {{Boîte déroulante/début}} pour mettre un tableau dans une boite déroulante.

Utilisation : pour {{Boîte déroulante}}

{{boîte déroulante|titre=TITRE|contenu=CONTENU}}
OU
{{boîte déroulante
 |align=ALIGN
 |alignT=ALIGNT
 |titre=TITRE
 |label=LABEL
 |contenu=CONTENU
 |largeur=LARGEUR
 |hauteur=HAUTEUR
 }}

Utilisation : pour {{Boîte déroulante/début}}

{{boîte déroulante/début|titre=TITRE}}
Contenu
{{boîte déroulante/fin}}

Paramètres obligatoires

paramètre effet valeurs possibles

titre Titre affiché de la boîte Totalement libre, mais le caractère « | » par exemple ne passe pas.

contenu Texte contenu dans la boîte Totalement libre, mais certains caractères spéciaux ne passent pas, comme la barre verticale. Utiliser dans ce cas :
{{Boîte déroulante/début}} contenu {{Boîte déroulante/fin}}.

Paramètres facultatifs

paramètre effet valeur par défaut valeurs possibles

br saut de ligne en entête br=yes br=no pour les boîtes déroulantes empilées.

arrondi (désactivé) arrondi des angles 0 Les angles peuvent apparaître arrondis si le navigateur le permet.
Visible sur les navigateurs Mozilla, non visible sur Internet Explorer.
Valeur conseillée : 0.6em, s’exprime en pt, px ou em

image image à gauche L’image facultative apparaît à l’ouverture de la boîte.
Elle doit être totalement renseignée.
Exemple : [[Fichier:Gtk-dialog-info.svg|15px]]

alignB alignement de la boîte left left, right, center ou justify

hauteur hauteur de la boîte repliée 1.6em La hauteur doit être exprimée avec une unité valable.
Ne pas mettre une hauteur inférieure à 1.6em sous peine d’effets indésirables

margeHaut marge haut (avant la boîte) 0em La hauteur doit être exprimée avec une unité valable.
Il est possible de mettre 0

margeBas marge bas (après la boîte) 1em La hauteur doit être exprimée avec une unité valable.
Il est possible de mettre 0

largeur largeur de la boîte 100% La largeur doit être exprimée avec une unité valable.

couleurBordure

couleur de la bordure

#AAAAAA

Expression de couleur valide
exemples : black, #C080FF, …

Table des couleurs

Page d’aide principale : fr:Aide:Couleurs

Nom de la couleur	Rendu/Name	Hexadécimal
		`#F0F8FF`
		`#FAEBD7`
Eau	Aqua	`#00FFFF`
		`#7FFFD4`
		`#F0FFFF`
		`#F5F5DC`
		`#FFE4C4`
Black	Black	`#000000`
		`#FFEBCD`
Blue	Blue	`#0000FF`
		`#8A2BE2`
		`#A52A2A`
		`#DEB887`
		`#5F9EA0`
		`#7FFF00`
		`#D2691E`
		`#FF7F50`
		`#6495ED`
		`#FFF8DC`
		`#DC143C`
		`#00FFFF`
		`#00008B`
		`#008B8B`
		`#B8860B`
		`#A9A9A9`
		`#006400`
		`#BDB76B`
		`#8B008B`
		`#556B2F`
		`#FF8C00`
		`#9932CC`
		`#8B0000`
		`#E9967A`
		`#8FBC8F`
		`#483D8B`
		`#2F4F4F`
		`#00CED1`
		`#9400D3`
		`#FF1493`
		`#00BFFF`
		`#696969`
		`#1E90FF`
		`#B22222`
		`#FFFAF0`
		`#228B22`
Fuchsia	Fuchsia	`#FF00FF`
		`#DCDCDC`
		`#F8F8FF`
		`#FFD700`
		`#DAA520`
Gray	Gray	`#808080`
Green	Green	`#008000`
		`#ADFF2F`
		`#F0FFF0`
		`#FF69B4`
		`#CD5C5C`
		`#4B0082`
		`#FFFFF0`
		`#F0E68C`
		`#E6E6FA`
		`#FFF0F5`
		`#7CFC00`
		`#FFFACD`
		`#ADD8E6`
		`#F08080`
		`#E0FFFF`
		`#FAFAD2`
		`#90EE90`
		`#D3D3D3`
		`#FFB6C1`
		`#FFA07A`
		`#20B2AA`
		`#87CEFA`
		`#778899`
		`#B0C4DE`
		`#FFFFE0`
Lime	Lime	`#00FF00`
		`#32CD32`
		`#FAF0E6`
		`#FF00FF`
Maroon	Maroon	`#800000`
		`#66CDAA`
		`#0000CD`
		`#BA55D3`
		`#9370DB`
		`#3CB371`
		`#7B68EE`
		`#00FA9A`
		`#48D1CC`
		`#C71585`
		`#191970`
		`#F5FFFA`
		`#FFE4E1`
		`#FFE4B5`
		`#FFDEAD`
Navy	Navy	`#000080`
		`#FDF5E6`
Oolive	Olive	`#808000`
		`#6B8E23`
		`#FFA500`
		`#FF4500`
		`#DA70D6`
		`#EEE8AA`
		`#98FB98`
		`#AFEEEE`
		`#DB7093`
		`#FFEFD5`
		`#FFDAB9`
		`#CD853F`
		`#FFC0CB`
		`#DDA0DD`
		`#B0E0E6`
Purple	Purple	`#800080`
Red	Red	`#FF0000`
		`#BC8F8F`
		`#4169E1`
		`#8B4513`
		`#FA8072`
		`#F4A460`
		`#2E8B57`
		`#FFF5EE`
		`#A0522D`
Silver	Silver	`#C0C0C0`
		`#87CEEB`
		`#6A5ACD`
		`#708090`
		`#FFFAFA`
		`#00FF7F`
		`#4682B4`
		`#D2B48C`
Teal	Teal	`#008080`
		`#D8BFD8`
		`#FF6347`
		`#40E0D0`
		`#EE82EE`
		`#F5DEB3`
White	White	`#FFFFFF`
		`#F5F5F5`
Yellow	Yellow	`#FFFF00`
		`#9ACD32`

couleurFondB couleur de fond de la boîte #FFFFFF

couleurFond couleur de fond du contenu white

Texte

align alignement du contenu left left, right, center ou justify

alignT alignement du titre center

taille taille de police du contenu 1em libre, de préférence exprimé en em : 1em, 0.9em, etc.

label texte du lien de droite [Dérouler] / [Enrouler] Totalement libre. Le caractère "/" permet de séparer les deux libellés. Exemple : [ afficher ] / [ masquer ].
NB : Cette valeur dépend du common.js, la valeur par défaut peut être personnalisable dans votre propre JS si ce paramètre n'est pas déjà indiqué.

couleurFondT

couleur de fond du titre

#EFEFEF

Expression de couleur valide
exemples : black, #C080FF, …

Table des couleurs

Page d’aide principale : fr:Aide:Couleurs

Nom de la couleur	Rendu/Name	Hexadécimal
		`#F0F8FF`
		`#FAEBD7`
Eau	Aqua	`#00FFFF`
		`#7FFFD4`
		`#F0FFFF`
		`#F5F5DC`
		`#FFE4C4`
Black	Black	`#000000`
		`#FFEBCD`
Blue	Blue	`#0000FF`
		`#8A2BE2`
		`#A52A2A`
		`#DEB887`
		`#5F9EA0`
		`#7FFF00`
		`#D2691E`
		`#FF7F50`
		`#6495ED`
		`#FFF8DC`
		`#DC143C`
		`#00FFFF`
		`#00008B`
		`#008B8B`
		`#B8860B`
		`#A9A9A9`
		`#006400`
		`#BDB76B`
		`#8B008B`
		`#556B2F`
		`#FF8C00`
		`#9932CC`
		`#8B0000`
		`#E9967A`
		`#8FBC8F`
		`#483D8B`
		`#2F4F4F`
		`#00CED1`
		`#9400D3`
		`#FF1493`
		`#00BFFF`
		`#696969`
		`#1E90FF`
		`#B22222`
		`#FFFAF0`
		`#228B22`
Fuchsia	Fuchsia	`#FF00FF`
		`#DCDCDC`
		`#F8F8FF`
		`#FFD700`
		`#DAA520`
Gray	Gray	`#808080`
Green	Green	`#008000`
		`#ADFF2F`
		`#F0FFF0`
		`#FF69B4`
		`#CD5C5C`
		`#4B0082`
		`#FFFFF0`
		`#F0E68C`
		`#E6E6FA`
		`#FFF0F5`
		`#7CFC00`
		`#FFFACD`
		`#ADD8E6`
		`#F08080`
		`#E0FFFF`
		`#FAFAD2`
		`#90EE90`
		`#D3D3D3`
		`#FFB6C1`
		`#FFA07A`
		`#20B2AA`
		`#87CEFA`
		`#778899`
		`#B0C4DE`
		`#FFFFE0`
Lime	Lime	`#00FF00`
		`#32CD32`
		`#FAF0E6`
		`#FF00FF`
Maroon	Maroon	`#800000`
		`#66CDAA`
		`#0000CD`
		`#BA55D3`
		`#9370DB`
		`#3CB371`
		`#7B68EE`
		`#00FA9A`
		`#48D1CC`
		`#C71585`
		`#191970`
		`#F5FFFA`
		`#FFE4E1`
		`#FFE4B5`
		`#FFDEAD`
Navy	Navy	`#000080`
		`#FDF5E6`
Oolive	Olive	`#808000`
		`#6B8E23`
		`#FFA500`
		`#FF4500`
		`#DA70D6`
		`#EEE8AA`
		`#98FB98`
		`#AFEEEE`
		`#DB7093`
		`#FFEFD5`
		`#FFDAB9`
		`#CD853F`
		`#FFC0CB`
		`#DDA0DD`
		`#B0E0E6`
Purple	Purple	`#800080`
Red	Red	`#FF0000`
		`#BC8F8F`
		`#4169E1`
		`#8B4513`
		`#FA8072`
		`#F4A460`
		`#2E8B57`
		`#FFF5EE`
		`#A0522D`
Silver	Silver	`#C0C0C0`
		`#87CEEB`
		`#6A5ACD`
		`#708090`
		`#FFFAFA`
		`#00FF7F`
		`#4682B4`
		`#D2B48C`
Teal	Teal	`#008080`
		`#D8BFD8`
		`#FF6347`
		`#40E0D0`
		`#EE82EE`
		`#F5DEB3`
White	White	`#FFFFFF`
		`#F5F5F5`
Yellow	Yellow	`#FFFF00`
		`#9ACD32`

couleurTexteT couleur du texte de titre black

thinning titre pas en gras no yes/no

Un modèle alternatif existe, composé de deux morceaux indissociables : {{Boîte déroulante/début}} et {{Boîte déroulante/fin}}, le premier accepte les mêmes paramètres que {{Boîte déroulante}}, la différence est que le contenu peut être arbitraire (alors que {{Boîte déroulante}} ne permet pas de caractères | dans le contenu).

par défaut (align=left, alignT=center) Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.		Contenu à droite (align=right) Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Contenu centré, titre à gauche (align=center, alignT=left) Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.		Contenu justifié, titre à droite (align=justify, alignT=right) Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
essais de couleurs pour démonstration couleurBordure=green couleurFondB=lightpink couleurFondT=yellow couleurTexteT=blue couleurFond=lightcyan		Boîte déroulante avec angles ronds (arrondi=0.6em) Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Voir aussi

**Comparaison des modèles de navigation**
voir • disc. • mod.	Enroulable	Couleur d’entête	Image	Groupes	Paramètres style (Entête)	Paramètres style (corps)	Exemple
Modèles pour palettes de navigation dédiées aux bas de pages
{{Méta palette de navigation}}	`collapsible`	`navbox`	Corps + En-tête	Oui	Oui	Oui	Exemples
{{Boîte déroulante}}	`NavFrame`	`NavHead`	Corps	Non	Oui	Oui	-
Modèles pour palettes de navigation dédiées aux débuts d’articles
{{Wikilien}}	N/A	N/A	Oui	N/A	N/A	Oui	Méta-modèle