Vous pouvez définir l’aspect général et le style du formulaire adaptatif en spécifiant un fichier CSS ou une bibliothèque client. En outre, vous pouvez appliquer des styles CSS intégrés à différents composants de formulaire adaptatif et prévisualiser les modifications apportées à la volée.
À l’aide de l’image suivante d’un composant de texte, voyons d’abord les différentes parties d’un composant de formulaire adaptatif sur lesquelles vous pouvez appliquer des styles.
Les différentes parties d’un composant de formulaire adaptatif mentionnées dans l’image ci-dessus sont les suivantes :
A. Libellé : légende du composant.
B. Champ : zone englobant toutes les parties du composant
C. Widget : zone dans laquelle l’utilisateur spécifie ou sélectionne une valeur pour le champ
D. Aide : brève description, description longue et indicateur d’aide du composant
Remarque :
Vous pouvez uniquement définir l’aspect du libellé. Pour modifier le texte du libellé, utilisez la propriété Titre de la zone de texte en mode d’édition. Pour plus d’informations, voir Barre d’outils de la page.
-
Cliquez sur un onglet de la barre latérale pour spécifier les propriétés CSS. Vous pouvez définir des propriétés telles que les suivantes :
- Dimensions et position (paramètre d’affichage, remplissage, hauteur, largeur, marge, position, index z, flottant, clair, débordement)
- Texte (famille de polices, épaisseur, couleur, taille, hauteur de ligne et alignement)
- Arrière-plan (image et gradient, couleur d’arrière-plan)
- Bordure (largeur, style, couleur, rayon)
- Effets (ombre, opacité)
- Avancé (permet de saisir un CSS personnalisé pour le composant)
>Style.
. Les propriétés de style s’ouvrent dans la barre latérale. 
Notez la modification du style de la zone de texte comme illustré ci-dessous après l’application des propriétés CSS suivantes.
Onglet |
Propriété CSS |
Valeur |
Effet |
Champ |
bordure |
Largeur de la bordure = 2px Couleur de la bordure = noir uni |
Crée une bordure large noire 2px autour du champ |
Widget |
couleur d’arrière-plan |
#6495ED |
Modifie la couleur d’arrière-plan en CornflowerBlue (#6495ED) Remarque : vous pouvez spécifier un nom de couleur ou son code hexadécimal dans le champ Valeur. |
Libellé |
Dimensions et position > largeur |
100px |
Définit la largeur sur 100 px pour le libellé |
Aide - Point d’interrogation |
couleur |
vert |
Modifie la couleur de l’indicateur d’aide en vert |
Aide - Description longue |
alignement de texte |
centre |
Aligne la description longue pour faciliter le centrage |
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.