Modèle:Colonnes/Documentation
Cette sous-page contient les instructions, les catégories de son modèle d'origine et elle n'est pas destinée à être visualisée directement.
1 Utilisation
Ce modèle permet d'afficher du texte sur plusieurs colonnes (avec une marge de séparation par défaut d'1 em entre elles).
Ce modèle n'utilise plus que les propriétés CSS normalisées (i.e. sans vendor prefixes), celles-ci étant maintenant implémentées par tous les navigateurs, notamment :
- Mozilla Firefox (moteur de rendu Gecko) : à partir de la version 52
- Google Chrome (moteur de rendu Blink) : à partir de la version 50
- Internet Explorer (moteur de rendu Trident) : à partir de la version 10
- Microsoft Edge (moteurs de rendu EdgeHTML puis Blink) : à partir de la version 12
- Safari (moteur de rendu WebKit) : à partir de la version 10
- Opera (moteur de rendu Blink) : à partir de la version 37
Pour plus d'informations sur le CSS concernant les colonnes, voir : W3C, module CSS3-Multicol, www.w3.org, et documentation développeurs Mozilla du rendu multicolonnes en CSS3.
Note : si le contenu à découper en colonnes contient des == Titres de section ==, préférez l'usage de {{Début de colonnes}} et {{Fin de colonnes}} afin de ne pas faire supprimer les liens d'édition de section (voir exemple).
2 Syntaxe
Selon le réglage de la largeur des colonnes ou du nombre de colonnes :
{{Colonnes|taille=em|1=contenu}}
(on donne une largeur minimale à chaque colonne — exprimée en em (ou cadratins)) ;{{Colonnes|nombre=n|1=contenu}}
(on impose le nombre de colonnes du tableau ; comme ce paramètre peut avoir un effet néfaste en matière de lisibilité sur les écrans qui ne sont pas suffisamment larges, son emploi en tant que paramètre isolé est déconseillé, voir l'alinéa suivant).
En combinant l'usage des deux paramètre taille=
et nombre=
, on donne une taille minimale à chaque colonne — exprimée en em (ou cadratins) — tout en fixant le nombre maximal de colonnes (il peut y en avoir moins mais ce nombre ne peut être dépassé) ; ainsi, on est assuré que le nombre de lignes par colonnes sera suffisant et ne déséquilibrera pas la présentation du tableau (en général, on souhaite que le nombre de lignes de chaque colonne soit au moins égal à trois) :
{{colonnes|taille=em|nombre=n|1=contenu}}
.
Exemple à propos de la combinaison des deux paramètres : en prenant colonnes=9|taille=xx
[alpha 1] pour un tableau qui a 28 items, on garantit que — même pour un écran très large — le nombre de colonnes ne pourra être supérieur à 9, donc que chaque colonne disposera au moins de « 28 (items) divisé par 9 (colonnes) » lignes, soit trois lignes (en prenant la partie entière de « 28 divisé par 9 » qui vaut 3,11) par colonne.
Il est possible d'ajouter un paramètre style pour une plus grande personnalisation du contenu :
{{Colonnes|taille=em|style=CSS|1=contenu}}
- ↑ Par exemple
taille=16
.
3 Paramètres
Modèle affichant du texte sur plusieurs colonnes.
Paramètre | Description | Type | Statut | |
---|---|---|---|---|
Taille | taille | Largeur minimale d’une colonne, en cadratins
| Nombre | suggéré |
Colonnes | nombre | Nombre maximum de colonnes (déconseillé si le paramètre « taille » n’est pas renseigné) | Nombre | facultatif |
Styles | style | Styles CSS supplémentaires | Chaîne | facultatif |
Contenu | 1 | Contenu affiché dans les colonnes | Chaîne | obligatoire |
Les colonnes vont se créer automatiquement en fonction de la largeur maximale spécifiée, pour occuper toute la largeur du bloc contenant ce modèle. La largeur conseillée pour une liste de mots est 18 em, et il est dans ce cas plutôt déconseillé de restreindre le nombre de colonnes. Les détails du comportement peuvent être consultés dans les documents précédemment mentionnés.
Pour faciliter la lecture sur les écrans de taille réduite, il est recommandé de spécifier la taille plutôt que le nombre de colonnes. |
4 Exemple
{{Colonnes|taille=18|1= # [[Algie vasculaire de la face]] # [[Carl Neuberg]] # [[Carrière militaire de Hugo Chávez]] # [[Carte d'identité étudiante internationale]] # [[Constitution argentine de 1853]] # [[Dieu est mort (Friedrich Nietzsche)]] # [[Dune]] # [[E=mc2]] # [[Écofascisme]] # [[Egberto Gismonti]] # [[Haute fréquence]] # [[Jardin botanique de Buitenzorg]] # [[Lancelot-Graal]] # [[Lögsögumad]] # [[Monica Frassoni]] # [[O-Bon]] # [[Particule α]] # [[Parti pirate]] # [[Quasar]] # [[Science du Moyen Âge]] # [[Self-Monitoring, Analysis and Reporting Technology]] # [[Véhicule spatial]] # [[Zircon]] }}
- Algie vasculaire de la face
- Carl Neuberg
- Carrière militaire de Hugo Chávez
- Carte d'identité étudiante internationale
- Constitution argentine de 1853
- Dieu est mort (Friedrich Nietzsche)
- Dune
- E=mc2
- Écofascisme
- Egberto Gismonti
- Haute fréquence
- Jardin botanique de Buitenzorg
- Lancelot-Graal
- Lögsögumad
- Monica Frassoni
- O-Bon
- Particule α
- Parti pirate
- Quasar
- Science du Moyen Âge
- Self-Monitoring, Analysis and Reporting Technology
- Véhicule spatial
- Zircon
5 Voir aussi
5.1 Modèles connexes
- {{Bloc solidaire}}, pour éviter qu’un bloc (une liste, par exemple) se trouve séparé sur plusieurs colonnes
- {{Début de colonnes}}, {{Fin de colonnes}}, {{Début de bloc solidaire}} et {{Fin de bloc solidaire}}, qui permettent d'éviter les problèmes avec les caractères « | » et « = »
5.2 Liens externes
column-count
,column-width
,column-rule
etcolumn-gap
sur MDN Web Docs