Modèle:Img float

Documentation

Cette documentation est incluse dans la sous-page de documentation (voir | modifier | historique). Si vous voulez améliorer ce modèle et si celui-ci est protégé, demandez à un administrateur de vous aider.

Utilisation

Permet de créer des images ou des schémas flottants.

Remarque

Lorsque align= vaut center, l’image n’est pas flottante. Pour obtenir une image flottante centrée, il faut préciser align=left et large=100% (cf. exemple 5, cas 2).

Syntaxe

Syntaxe simplifiée

{{Img float
 | file = 
 | width = 
 | align = 
 | cap = 
}}

Syntaxe complète

{{Img float
 | style = 
 | m = 
 | large =
 | above = 
 | file = 
 | width = 
 | align = 
 | cap = 
 | capalign = 
 | alt = 
 | ancre =
}}

Paramètres

Permet de créer des images ou des schémas flottants.

Paramètres du modèle[Modifier les données du modèle]
La mise en forme multiligne est préférée pour ce modèle.
Paramètre		Description	Type	État
Nom du fichier	`file`	Nom du fichier sans le préfixe « File: » ou « Fichier: » Exemple The Kinematics of Machinery Fig 2.jpg	Fichier	obligatoire
Largeur de l’image	`width`	Largeur de l’image Par défaut 150px Exemple 2em, 200px	Chaîne	facultatif
Margeverticale	`m`	Marge verticale avant et après le bloc image + légende Par défaut 1em si align=center, 0 sinon Exemple 2em, 20px	Chaîne	facultatif
Largeur du cadre	`large`	Largeur du cadre contenant l’image Par défaut 150px Exemple 2em, 200px	Chaîne	facultatif
Légende	`cap`	Légende de l’image	Chaîne	facultatif
Alignement	`align`	Aligne l’image à gauche, à droite, ou au centre Par défaut right Exemple left, right, center	Chaîne	facultatif
(alt-text) Texte alternatif	`alt`	Texte qui apparaît lors du survol par la souris, ou pour les systèmes pour malvoyants	Chaîne	facultatif
Alignement de la légende	`capalign`	Alignement du texte de la légende Par défaut center Exemple left, right, center	Chaîne	facultatif
Autres styles en CSS	`style`	Permet d’insérer d’autres styles en CSS Exemple font-size: 80%; line-height: 80%;	Chaîne	facultatif
Texte au-dessus	`above`	Ajoute du texte au-dessus de l'image	Chaîne	facultatif
Ancre	`ancre`	Ancre (doit contenir au moins une lettre)	Chaîne	facultatif

Exemple

Exemple 1. — Image à droite

Code wiki	Rendu
{{Img float \| file = The Kinematics of Machinery Fig 1.png \| width = 250px \| align = right \| cap = Fig. 2. }} {{lorem ipsum}}	Fig. 2. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit.

Exemple 2. — Image à gauche

Code wiki	Rendu
{{Img float \| file = The Kinematics of Machinery Fig 2.jpg \| width = 250px \| align = left \| cap = Fig. 2. }} {{lorem ipsum}}	Fig. 2. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit.

Exemple 3. — Légende alignée à gauche

Code wiki	Rendu
{{Img float \| file = The Kinematics of Machinery Fig 2.jpg \| width = 250px \| align = right \| cap = Fig. 2. \| capalign = left }} {{lorem ipsum}}	Fig. 2. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit.

Exemple 4. — Image à droite avec texte au dessus

Code wiki	Rendu
{{Img float \| style = \| file = The Kinematics of Machinery Fig 1.png \| width = 250px \| align = right \| above = Kinematics of Machinery \| cap = Fig. 1. }} {{lorem ipsum}}	Kinematics of Machinery Fig. 1. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit.

Exemple 5. — Image centrée

Dans ce cas, le texte ne peut pas entourer l’image.

Premier cas. — Image non flottante.

Code wiki	Rendu
{{exemple texte\|3}} {{Img float \| file = The Kinematics of Machinery Fig 2.jpg \| width = 250px \| align = center \| cap = Fig. 2. }} {{exemple texte\|5}}	Longtemps, je me suis couché de bonne heure. Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : « Je m’endors. » Fig. 2. Longtemps, je me suis couché de bonne heure. Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : « Je m’endors. » Et, une demi-heure après, la pensée qu’il était temps de chercher le sommeil m’éveillait ; je voulais poser le volume que je croyais avoir encore dans les mains et souffler ma lumière ;

Deuxième cas. — Image flottante

Code wiki	Rendu
{{exemple texte\|3}} {{Img float \| large = 100% \| file = The Kinematics of Machinery Fig 2.jpg \| width = 250px \| m = 2em \| cap = Fig. 2. }} {{exemple texte\|5}}	Longtemps, je me suis couché de bonne heure. Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : « Je m’endors. » Fig. 2. Longtemps, je me suis couché de bonne heure. Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : « Je m’endors. » Et, une demi-heure après, la pensée qu’il était temps de chercher le sommeil m’éveillait ; je voulais poser le volume que je croyais avoir encore dans les mains et souffler ma lumière ;

Voir aussi

{{Image2}}
{{fig.}}