- Présentation
- La gestion des états
- Onglet Texte
- Polices
- Taille
- Décoration
- Autres paramètres de la police
- Paragraphes
- Onglet Fond
Description d'un style d'élément WEBDEV
Les différents champs d'un projet WEBDEV sont associés à des styles WEBDEV. Ce style est composé de plusieurs styles d'éléments WEBDEV.  Nouveauté 2025A partir de la version 2025 Update 1, le terme "Style d'élément WEBDEV" remplace le terme "Style CSS". Cette page prend en compte le nouveau vocabulaire. Les styles d'éléments WEBDEV permettent de réutiliser une spécificité du style dans tous les champs utilisant ce style d'élément. Par exemple, il est possible de définir un style d'élément WEBDEV pour indiquer les caractéristiques de la police pour les champs Boutons du site.
Remarque : Le style d'éléments WEBDEV s'appuie sur des propriétés CSS. Pour créer ou modifier un style d'élément WEBDEV : - Affichez l'onglet "Style" de la fenêtre de description du champ.
- Dans le champ "Styles de l'élément", affichez le menu contextuel d'un jeton (ou de la zone de saisie) et sélectionnez :
- soit l'option "Editer le style de l'élément".
- soit l'option "Créer un nouveau style d'élément".
- La fenêtre de description d'un style d'élément WEBDEV s'affiche.
Remarques : - Cette fenêtre est également affichée :
- depuis l'onglet "Style" de la fenêtre de description du champ, lors du clic sur le lien "+ de surcharges". Dans ce cas, les modifications réalisées dans la fenêtre sont locales au champ utilisé. CEs modifications ne seront pas reportées sur les champs utilisant ce style d'élément WEBDEV.
- depuis la fenêtre d'édition des styles d'élément WEBDEV (option "Modifier" du menu contextuel). Pour plus de détails, consultez Edition des styles d'éléments WEBDEV du projet.
- Les styles d'éléments WEBDEV provenant d'une ambiance ne sont pas modifiables.
Cette fenêtre permet de : - Modifier les caractéristiques d'un style existant. Il suffit de sélectionner l'état à modifier, de modifier les caractéristiques du style voulues puis de valider.
Remarque : Par défaut, les modifications sont locales au champ. Elles permettent de surcharger le style de référence du champ en cours. L'onglet "Style" du champ permet de gérer la mise à jour du style. Pour plus de détails, consultez Styles WEBDEV. - Réinitialiser l'état sélectionné. Ce bouton permet d'effacer toutes les surcharges pour l'état sélectionné.
- Tout Réinitialiser. Ce bouton permet d'effacer toutes les surcharges pour tous les états.
- Importer du code CSS. Ce bouton permet d'importer un code CSS permettant de modifier certaines caractéristiques CSS du style. Dans la fenêtre qui s'ouvre, le code CSS saisi doit correspondre au code d'un "sélecteur CSS".
Cette page d'aide détaille les différentes options de l'onglet "Texte" et de l'onglet "Fond". L'aperçu permet de voir dynamiquement les caractéristiques du style. Il est possible de définir une variation de style pour chaque état de l'élément. Les propriétés <Non définie> utilisent les propriétés de l'état "Normal". Dans l'état "Normal", si une propriété est <Non définie>, les options correspondantes définies dans le navigateur de l'internaute seront prises en compte. Remarque : Certains états ne sont pas disponibles pour tous les types de champs. Le tableau ci-dessous présente les différents états possibles en fonction des champs et des navigateurs : | | | | | | | | | Survol | Actif | Lien non visité | Lien visité | Premier fils | Première lettre | Première ligne | | Libellé | | | | | | X | X | | Libellé HTML | | | | | X (FireFox uniquement) | X | X | | Bouton graphique | X | X | X | X (Internet Explorer uniquement) | X (FireFox uniquement) | | | | Bouton Java | | | | | | | | | Bouton texte | X (FireFox uniquement) | X (FireFox uniquement) | | | X (FireFox uniquement) | | | | Lien | X | X | X | X | X (FireFox uniquement) | X | | | Image | X (FireFox uniquement) | X (FireFox uniquement) | | | X (FireFox uniquement) | | | | Image cliquable | X (FireFox uniquement) | X (FireFox uniquement) | | | X (FireFox uniquement) | | | | Vignette | X (FireFox uniquement) | X (FireFox uniquement) | | | X (FireFox uniquement) | | | | Champ d'affichage formaté | | | | | | X | X | | Champ de saisie | X (FireFox uniquement) | X (FireFox uniquement) | | | X (FireFox uniquement) | | | | Sélecteur | X (FireFox uniquement) | | | | | | | | Interrupteur | | | | | | | | | Liste | X (FireFox uniquement) | X (FireFox uniquement) | | | X (FireFox uniquement) | | | | Combo | X (FireFox uniquement) | X (FireFox uniquement) | | | X (FireFox uniquement) | | | | Table | | | | | X (FireFox uniquement) | X | X | | Réglette | | | | | | X | X | | Arbre | X | X | X | X (Internet Explorer uniquement) | X (FireFox uniquement) | | | | Ligne | | | | | X (FireFox uniquement) | | | | Chemin de navigation | X | X | X | X | X (FireFox uniquement) | | |
Polices Sélectionnez une des familles de polices disponibles. Une famille de polices est un ensemble ordonné de polices. Si la première police n'est pas disponible sur le poste de l'internaute, la deuxième police est recherchée. Si cette police est disponible, elle est utilisée, sinon la police suivante est recherchée. Le bouton [...] permet de créer de nouvelles familles de polices, de dupliquer et de modifier des familles existantes. Taille Sélectionnez la taille de la police. Les tailles possibles sont : - Une taille définie, précisée dans une unité spécifique (pixels, centimètres, millimètres, pouces, point, pica, pourcentage, ...).
- Une taille relative à la police en cours (au moment de l'affichage de la page) :
- xx-small : Taille extrêmement petite
- x-small : Taille très petite
- small : Taille petite
- medium : Taille normale
- x-large : Taille grande
- xx-large : Taille très grande
- -1 : la plus petite taille
- +1 : la plus grande taille
Décoration Options supplémentaire de mise en forme de la police. Ces options permettent par exemple de souligner des liens ou de les barrer. - Aucune : pas de décoration supplémentaire particulière
- Barré : le texte est barré : un trait apparaît au milieu du texte. Exemple : a
- Souligné : le texte est souligné. Exemple : B
- Clignotant : le texte clignote (cette option n'a d'effet que si l'internaute utilise le navigateur Netscape)
- Surligné : un trait est présent au dessus du texte.
Autres paramètres de la police | | | Alignement | Présentation du texte : aligné à gauche, centré, aligné à droite ou justifié (aligné à gauche et à droite). | | Alignement vertical | Alignement du texte en hauteur par rapport à la zone disponible. | | Casse | Mise en forme du caractère : 1ère lettre en majuscule, majuscule, minuscule ou aucune (par défaut). | | Césure | Gestion de la césure des mots. Il est possible d'utiliser une césure classique ou bien de couper les mots si nécessaire. | | Couleur | Sélectionnez la couleur de la police. | | Graisse | Épaisseur du caractère. Il est possible de sélectionner :- une graisse prédéfinie (normal, gras, épais, léger)
- une épaisseur (de 100 à 900)
| | Indentation | Retrait de première ligne. Indiquez une valeur qui peut être exprimée en pixels, centimètres, millimètres, pouces, point, pica, pourcentage, ... | | Interlettrage | Espace entre les lettres. Indiquez une valeur qui peut être exprimée en pixels, centimètres, millimètres, pouces, point, pica, pourcentage, etc. | | Interligne | Espace entre les lignes. Indiquez une valeur qui peut être exprimée en pixels, centimètres, millimètres, pouces, point, pica, pourcentage, etc. | | Style | Style des caractères : normal, italique, oblique | | Variante | Mode d'affichage des caractères : normal ou petites majuscules. |
Paragraphes Il est possible de gérer l'espacement avant et après chaque paragraphe. Il suffit de préciser la valeur de l'espacement et l'unité choisie.Les caractéristiques modifiables sur l'onglet "Fond" sont les suivantes : | | | Couleur | Sélectionnez la couleur de fond du champ. | | Image | Image affichée en fond du champ. L'image choisie doit être présente dans le répertoire des images du projet (<NomProjet>_WEB). | | Répétition | Répétition de l'image dans le champ. L'image peut être répétée :- en mosaïque (option répétée)
- à l'horizontal (option répétée X)
- à la verticale (option répétée Y)
| | Position fixe | Si cette option est choisie, l'image ne sera pas déplacée ("scrollée") lors de l'utilisation de l'ascenseur. | | Position horizontale et verticale | Position de l'image par rapport au champ. La valeur indiquée peut être exprimée en pixels, centimètres, millimètres, pouces, point, pica, pourcentage, ... |
|
|
|