Plantilla:Img float

Icona de documentació de mòdul Documentació de la plantilla [ mostra ] [ modifica el codi ] [ mostra l'historial ] [ refresca ]


Descripció

modifica

Crea una imatge "flotant" amb la seva llegenda opcional

{{Img float
 | arxiu       = 
 | ample       = 
 | align       = 
 | above       =
 | llegenda    =  
 | alt         =  
 | polígon     =
 | estil       =
}}

Sintaxi

modifica
  • arxiu: El nom de l'arxiu (sense el prefix "Fitxer:") (obligatori)
  • ample: L'amplada de la imatge (opcional, per defecte 150px)
  • align: L'estil d'aliniament de la imatge en la pàgina, ("left", "esquerra" o "e"; "right", "dreta" o "d", o "center", "centre" o "c"; per defecte "right")
  • above: Agrega text sobre la imatge.
  • llegenda: La llegenda de la imatge (opcional). No feu ervir cap etiqueta <div> o plantilles basades en div, com Plantilla:Ep: si la plantilla es posiciona al mig d'un paràgraf, el programari agregarà un salt de paràgraf.
  • alt: Text alternatiu a la imatge que apareix al passar el cursor per sobre o un lector de pantalla per a persones amb discapacitat visual
  • polígon: permet usar una forma diferent al rectangle per a que el text s'adapti a ella (opcional, es fan servir coordenades en parells separades amb una coma)
  • estil: agregar estils de text addicional. Si es canvia la mida del text, també caldria canviar l'alçada de la línia (per exemple: | estil = font-size: 80%; line-height: 80%;).

Exemples

modifica

Imatge a la dreta

modifica
{{Img float
 | arxiu    = The Kinematics of Machinery Fig 2.jpg
 | ample    = 250px
 | align    = right
 | llegenda = Fig. 2.
}}


Fig. 2.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Imatge a l'esquerra

modifica
{{Img float
 | arxiu    = The Kinematics of Machinery Fig 2.jpg
 | ample    = 250px
 | align    = left
 | llegenda = Fig. 2.
}}


Fig. 2.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Imatge a la dreta amb text a la part superior

modifica
{{Img float
 | estil    = 
 | above    = Fig. 2
 | arxiu    = The Kinematics of Machinery Fig 1.png
 | ample    = 250px
 | align    = right
 | llegenda = Esta es realmente la figura 1.
}}

Fig. 2

Esta es realmente la figura 1.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Imatge al centre

modifica
{{Img float
 | arxiu    = The Kinematics of Machinery Fig 2.jpg
 | ample    = 250px
 | align    = center
 | llegenda = Fig. 2.
}}

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.
Fig. 2.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Contorn diferent d'un rectangle amb |polígon=

modifica

Si la imatge no és rectangula i vols fer que el text flueixi més aprop de la imatge, usa el paràmetre polígon. Aquest paràmetre usa sintaxi CSS: parells de coordenades separades per una coma, ambdues expressades com un percentatge (per exemple 20%, 50%).

Nota: Els valors absoluts (com 10px, 25px) poden funcionar només en algunes mides de pantalla. Millor fer servir percentatges.

{{img float
|arxiu=Select Popular Tales from the German of Musaeus (drop cap, page 1).jpg
|align=left
|ample=300px
|polígon=0 0, 100% 0, 100% 34%, 60% 34%, 60% 58%, 36% 58%, 36% 100%, 0 100%
}}
{{lorem ipsum}}

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Vegeu també

modifica