Utilisation des valves, génération du site web de l'ULB - format xml
sommairesommaireindexindexdébutdébutpage précédentepage précédentepage suivantepage suivanteimprimerimprimerenvoyerenvoyermarquermarquer

Bordure autour des images

L'élément <bordure>, placé dans l'élément <vignette> ou <illustration>, permet d'ajouter une bordure tout autour de l'image.

Les caractéristiques de la bordure, et donc son apparence, peuvent être modifiées grâce à des attributs placés sur cet élément.
Exemple
<valves style="cadre2" maximum="2">
   <affichage>
      <titre/>
      <vignette hauteur="80" largeur="80" position="droite-texte">
         <bordure/>
      </vignette>
      <aperçu/>
   </affichage>
   <source-xml href="http://www.ulb.ac.be/cache/news-test1.xml"/> 
</valves>

On utilise dans cet exemple une bordure avec toutes les valeurs par défaut:

  • position: intérieure

  • taille: 1 pixel

  • couleur: noir

  • pas de transparence
loading...ajax1

Modifier l'apparence de la bordure

La taille, donnée en nombre de pixels, est paramétrable (attribut taille).

La couleur et la transparence de la bordure sont paramètrables (attributs couleur et transparence).

La bordure peut être extérieure (elle s'ajoute à l'image) ou intérieure (elle se superpose à l'image) grâce à l'attribut position.


Ces attributs sont repris en détail ci-après:


taille="..."

L'attribut taille détermine la taille de la bordure, donnée en nombre de pixels. Par défaut, la taille est égale à 1.


L'exemple ci-contre illustre la taille par défaut, qui est de 1 pixel.

...
<vignette>
   <bordure/>
</vignette>
...

loading...ajax2

Cet exemple utilise une taille de 4 pixels.

...
<vignette>
   <bordure taille="4"/>
</vignette>
...

loading...ajax3

couleur="..."

L'attribut couleur détermine la couleur de la bordure. Il peut valoir "noir", une des couleurs de l'ULB, ou un code de couleur exprimé en hexadécimal au format habituel (exemple, #C8D8D8). La valeur par défaut est noir.


L'exemple ci-contre illustre la couleur par défaut, qui est le noir.

...
<vignette>
   <bordure taille="2"/>
</vignette>
...

loading...ajax4

Cet exemple utilise une bordure dans le bleu ULB.

...
<vignette>
   <bordure couleur="bleuULB" taille="2"/>
</vignette>
...

loading...ajax5

Cet exemple utilise une bordure de couleur donnée par le code #CC9999.

...
<vignette>
   <bordure couleur="#CC9999" taille="2"/>
</vignette>
...

loading...ajax6

transparence="..."

L'attribut transparence détermine la transparence de la bordure. Il doit contenir une valeur entre 0 (pas de transparence) et 100 (transparence totale).


L'exemple ci-contre illustre la transparence par défaut, égale à 0.

...
<vignette>
   <bordure taille="4"/>
</vignette>
...

loading...ajax7

L'exemple ci-contre illustre une transparence égale à 60%.

...
<vignette>
   <bordure transparence="60" taille="4"/>
</vignette>
...

loading...ajax8

L'exemple ci-contre illustre une transparence égale à 80%.

...
<vignette>
   <bordure transparence="80" taille="4"/>
</vignette>
...

loading...ajax9

position="..."

L'attribut position détermine la position de la bordure, soit intérieure, c'est à dire superposée à l'image sans changer les dimensions de celle-ci, soit extérieure, c'est-à-dire ajoutée à celle-ci (les dimensions sont agrandies avec celles de la bordure).


Exemple avec position intérieure.

...
<vignette>
   <bordure position="intérieure" transparence="80" taille="4"/>
</vignette>
...

loading...ajax10

Exemple avec position extérieure.

...
<vignette>
   <bordure position="extérieure" transparence="80" taille="4"/>
</vignette>
...

loading...ajax11
sommairesommaireindexindexdébutdébutpage précédentepage précédentepage suivantepage suivante
ULB - entreprise écodynamique