Cette page explique comment présenter le texte des chapitres d'un livre, les citations, ... Les modèles permettent d'aider à présenter une page :
- voir Aide:Modèles pour la syntaxe permettant d'inclure un modèle,
- voir Wikilivres:Modèles pour la liste des modèles disponibles.
Présentation sur deux colonnes
La présentation sur deux colonnes permet de combler le vide en juxtaposant deux parties du texte l'une à côté de l'autre, ou bien de présenter une illustration pour le texte d'à côté. Cependant sur téléphone mobile, la largeur de l'écran ne permet pas une telle juxtaposition de manière lisible et pratique. Voir Version mobile.
Toutefois, voici deux moyens de faire une présentation adaptative : sur deux colonnes quand la largeur de l'écran le permet, ou sur une seule colonne (une partie sous l'autre) sur les écrans de petite largeur.
Zones
Cette façon de faire utilise les balises <div> de la syntaxe HTML.
La syntaxe à utiliser est la suivante :
<div class="flex-content"> <div class="flex-content-half"> <!-- La première partie --> </div> <div class="flex-content-half"> <!-- La seconde partie --> </div> </div>
Tableau
L'autre façon de présenter sur deux colonnes utilise la syntaxe wiki des tableaux, en utilisant la classe CSS "flexible".
{| class="flexible"
|
<!-- La première partie -->
|
<!-- La seconde partie -->
|}
Sans découpe prédéterminée
Les deux premières façons supposent que le contenu a des parties prédéterminées répartissable sur deux colonnes.
Cette troisième façon de faire s'utilise quand le texte n'a pas de découpe prédéterminée entre les deux colonnes et utilise la fonctionnalité columns des feuilles de style.
De plus, comme illustré ci-dessous, quand la largeur d'affichage est en dessous du seuil paramétré (350 pixels dans l'exemple), le contenu s'affiche sur une colonne.
<div style="columns: 2 350px;"> <!-- Le contenu à répartir sur deux colonnes, ou une seule en dessous de 350 pixels de largeur par colonne. --> </div>
Citations
Exemple :
{{Modèle:BlocCitation|Lorem ipsum dolor sit amet, consectetur adipiscing elit. (… etc; etc. citation longue …) lorem varius purus. Curabitur eu amet.|auteur=[[w:Faux-texte|Pas d’auteur]] - texte sans signification (aurait originellement été tiré d'un ouvrage écrit par Cicéron en 45 av. J.-C.)}}
| « | |
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. (… etc; etc. citation longue …) lorem varius purus. Curabitur eu amet. | |
| » | |
| — Pas d’auteur - texte sans signification (aurait originellement été tiré d'un ouvrage écrit par Cicéron en 45 av. J.-C.) |
Voir Modèles de citation pour d'autres modèles.