Aller au contenu

Modèle:Img float/documentation

De Encyclopédie

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{{#if:|{{{1}}}| }}5, cas{{#if:|{{{1}}}| }}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

<templatedata> { "params": { "align": { "label": "Alignement", "description": "Aligne l’image à gauche, à droite, ou au centre", "example": "left, right, center", "type": "string", "default": "right" }, "capalign": { "label": "Alignement de la légende", "description": "Alignement du texte de la légende", "example": "left, right, center", "type": "string", "default": "center" }, "width": { "label": "Largeur de l’image", "description": "Largeur de l’image", "example": "2em, 200px", "type": "string", "default": "150px" }, "large": { "label": "Largeur du cadre", "description": "Largeur du cadre contenant l’image", "example": "2em, 200px", "type": "string", "default": "150px" }, "m": { "label": "Margeverticale", "description": "Marge verticale avant et après le bloc image + légende", "example": "2em, 20px", "type": "string", "default": "1em si align=center, 0 sinon" }, "style": { "label": "Autres styles en CSS", "description": "Permet d’insérer d’autres styles en CSS", "example": "font-size: 80%; line-height: 80%;", "type": "string" }, "above": { "label": "Texte au-dessus", "description": "Ajoute du texte au-dessus de l'image", "type": "string" }, "file": { "label": "Nom du fichier", "description": "Nom du fichier sans le préfixe « File: » ou « Fichier: »", "example": "The Kinematics of Machinery Fig 2.jpg", "type": "wiki-file-name", "required": true }, "alt": { "label": "(alt-text) Texte alternatif", "description": "Texte qui apparaît lors du survol par la souris, ou pour les systèmes pour malvoyants", "type": "string" }, "cap": { "label": "Légende", "description": "Légende de l’image", "type": "string" }, "ancre": { "label": "Ancre", "description": "Ancre (doit contenir au moins une lettre)", "type": "string" } }, "description": "Permet de créer des images ou des schémas flottants.", "paramOrder": [ "file", "width",

       "m",
       "large",

"cap", "align", "alt", "capalign", "style", "above",

       "ancre"

], "format": "block" } </templatedata>

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}}
center|
{{#if:|{{{above}}}
}}
Fichier:The Kinematics of Machinery Fig 1.png
{{#if:Fig. 2.|
Fig. 2.}}
{{{above}}}
}}Fichier:The Kinematics of Machinery Fig 1.png{{#if:Fig. 2.|
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}}
center|
{{#if:|{{{above}}}
}}
Fichier:The Kinematics of Machinery Fig 2.jpg
{{#if:Fig. 2.|
Fig. 2.}}
{{{above}}}
}}Fichier:The Kinematics of Machinery Fig 2.jpg{{#if:Fig. 2.|
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}}
center|
{{#if:|{{{above}}}
}}
Fichier:The Kinematics of Machinery Fig 2.jpg
{{#if:Fig. 2.|
Fig. 2.}}
{{{above}}}
}}Fichier:The Kinematics of Machinery Fig 2.jpg{{#if:Fig. 2.|
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}}
center|
{{#if:Kinematics of Machinery|Kinematics of Machinery
}}
Fichier:The Kinematics of Machinery Fig 1.png
{{#if:Fig. 1.|
Fig. 1.}}
Kinematics of Machinery
}}Fichier:The Kinematics of Machinery Fig 1.png{{#if:Fig. 1.|
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. {{#ifexpr: 3 > 1

Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : {{#ifexpr: 3 > 2 « Je m’endors. » {{#ifexpr: 3 > 3 Et, une demi-heure après, la pensée qu’il était temps de chercher le sommeil m’éveillait ; {{#ifexpr: 3 > 4 je voulais poser le volume que je croyais avoir encore dans les mains et souffler ma lumière ; {{#ifexpr: 3 > 5 je n’avais pas cessé en dormant de faire des réflexions sur ce que je venais de lire, mais ces réflexions avaient pris un tour un peu particulier ; {{#ifexpr: 3 > 6 il me semblait que j’étais moi-même ce dont parlait l’ouvrage : {{#ifexpr: 3 > 7 une église, un quatuor, la rivalité de François Ier et de Charles-Quint. {{#ifexpr: 3 > 8 Cette croyance survivait pendant quelques secondes à mon réveil ; {{#ifexpr: 3 > 9 elle ne choquait pas ma raison, mais pesait comme des écailles sur mes yeux et les empêchait de se rendre compte que le bougeoir n’était pas allumé. {{#ifexpr: 3 > 10 Puis elle commençait à me devenir inintelligible, comme après la métempsycose les pensées d’une existence antérieure ;}}}}}}}}}}}}}}}}}}}}

{{#ifeq:center|center|

{{#if:|{{{above}}}
}}
Fichier:The Kinematics of Machinery Fig 2.jpg
{{#if:Fig. 2.|
Fig. 2.}}
{{{above}}}
}}Fichier:The Kinematics of Machinery Fig 2.jpg{{#if:Fig. 2.|
Fig. 2.}}}}

Longtemps, je me suis couché de bonne heure. {{#ifexpr: 5 > 1

Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : {{#ifexpr: 5 > 2 « Je m’endors. » {{#ifexpr: 5 > 3 Et, une demi-heure après, la pensée qu’il était temps de chercher le sommeil m’éveillait ; {{#ifexpr: 5 > 4 je voulais poser le volume que je croyais avoir encore dans les mains et souffler ma lumière ; {{#ifexpr: 5 > 5 je n’avais pas cessé en dormant de faire des réflexions sur ce que je venais de lire, mais ces réflexions avaient pris un tour un peu particulier ; {{#ifexpr: 5 > 6 il me semblait que j’étais moi-même ce dont parlait l’ouvrage : {{#ifexpr: 5 > 7 une église, un quatuor, la rivalité de François Ier et de Charles-Quint. {{#ifexpr: 5 > 8 Cette croyance survivait pendant quelques secondes à mon réveil ; {{#ifexpr: 5 > 9 elle ne choquait pas ma raison, mais pesait comme des écailles sur mes yeux et les empêchait de se rendre compte que le bougeoir n’était pas allumé. {{#ifexpr: 5 > 10 Puis elle commençait à me devenir inintelligible, comme après la métempsycose les pensées d’une existence antérieure ;}}}}}}}}}}}}}}}}}}}}
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. {{#ifexpr: 3 > 1

Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : {{#ifexpr: 3 > 2 « Je m’endors. » {{#ifexpr: 3 > 3 Et, une demi-heure après, la pensée qu’il était temps de chercher le sommeil m’éveillait ; {{#ifexpr: 3 > 4 je voulais poser le volume que je croyais avoir encore dans les mains et souffler ma lumière ; {{#ifexpr: 3 > 5 je n’avais pas cessé en dormant de faire des réflexions sur ce que je venais de lire, mais ces réflexions avaient pris un tour un peu particulier ; {{#ifexpr: 3 > 6 il me semblait que j’étais moi-même ce dont parlait l’ouvrage : {{#ifexpr: 3 > 7 une église, un quatuor, la rivalité de François Ier et de Charles-Quint. {{#ifexpr: 3 > 8 Cette croyance survivait pendant quelques secondes à mon réveil ; {{#ifexpr: 3 > 9 elle ne choquait pas ma raison, mais pesait comme des écailles sur mes yeux et les empêchait de se rendre compte que le bougeoir n’était pas allumé. {{#ifexpr: 3 > 10 Puis elle commençait à me devenir inintelligible, comme après la métempsycose les pensées d’une existence antérieure ;}}}}}}}}}}}}}}}}}}}}

{{#ifeq:{{{align}}}|center|

{{#if:|{{{above}}}
}}
Fichier:The Kinematics of Machinery Fig 2.jpg
{{#if:Fig. 2.|
Fig. 2.}}
{{{above}}}
}}Fichier:The Kinematics of Machinery Fig 2.jpg{{#if:Fig. 2.|
Fig. 2.}}}}

Longtemps, je me suis couché de bonne heure. {{#ifexpr: 5 > 1

Parfois, à peine ma bougie éteinte, mes yeux se fermaient si vite que je n’avais pas le temps de me dire : {{#ifexpr: 5 > 2 « Je m’endors. » {{#ifexpr: 5 > 3 Et, une demi-heure après, la pensée qu’il était temps de chercher le sommeil m’éveillait ; {{#ifexpr: 5 > 4 je voulais poser le volume que je croyais avoir encore dans les mains et souffler ma lumière ; {{#ifexpr: 5 > 5 je n’avais pas cessé en dormant de faire des réflexions sur ce que je venais de lire, mais ces réflexions avaient pris un tour un peu particulier ; {{#ifexpr: 5 > 6 il me semblait que j’étais moi-même ce dont parlait l’ouvrage : {{#ifexpr: 5 > 7 une église, un quatuor, la rivalité de François Ier et de Charles-Quint. {{#ifexpr: 5 > 8 Cette croyance survivait pendant quelques secondes à mon réveil ; {{#ifexpr: 5 > 9 elle ne choquait pas ma raison, mais pesait comme des écailles sur mes yeux et les empêchait de se rendre compte que le bougeoir n’était pas allumé. {{#ifexpr: 5 > 10 Puis elle commençait à me devenir inintelligible, comme après la métempsycose les pensées d’une existence antérieure ;}}}}}}}}}}}}}}}}}}}}

Voir aussi

  • {{[[Modèle:{{#if:x|Image2|}}|{{#if:x|Image2|}}]]}}
  • {{[[Modèle:{{#if:x|img float-p|}}|{{#if:x|img float-p|}}]]}}
  • {{[[Modèle:{{#if:x|fig.|}}|{{#if:x|fig.|}}]]}}