Le menu Style vous permet de changer l'apparence de vos documents en utilisant les cascades des feuilles de style (CSS).
L'entrée Style CSS du menu Style, ou le bouton , permet d'engendrer une liste de propriétés CSS. Cette entrée de menu affiche une boite de dialogue avec 4 différents onglets: Caractères, Couleurs, Boites, Format.
Quand l'utilisateur a positionne un ensemble de propriétés, il peut appliquer ces propriétés à la sélection courante :
Dans tous les cas, les adresses des images incluses dans la liste des propriétés (background-image, list-style-image) seront transformées en adresses relatives au document sélectionné.
Un document peut associer plusieurs feuilles de style externes qui sont chargées avec le document et lui sont appliquées.
Une feuille de style externe peut s'appliquer à plusieurs documents. Quand la même feuille de style s'applique à plusieurs documents affichés, Amaya ne charge qu'une seule instance de la feuille de style.
L'utilisateur peut définir une feuille de style spécifique qui s'applique à tous les documents chargés. Cette feuille de style est appelée Feuille de Style Utilisateur. c'est le fichier local amaya.css conservé dans l'environnement de l'utilisateur (le répertoire d'AmayaHome).
Par exemple si vous préférez afficher les document en Helvetica et imprimer avec une police de caractères de petite taille, vous pouvez créer votre feuille de style utilisateur avec les règles CSS suivantes :
@media print { body {font-size: 10pt} } @media screen { body {font-family: Helvetica} }
Le menu Style donne accès à une série de commandes qui permettent de contrôler les feuilles de style CSS externes et de l'utilisateur :
Cette commande fait apparaître une boîte de dialogue :
Les commandes Ouvrir, Désactiver et Réactiver peuvent être appliquées à la feuille de style de l'utilisateur, mais les commandes Ajouter et Retirer concernent uniquement les feuilles de style externes.
S'il y a beaucoup de feuilles de style attachées à un document, il est difficile de comprendre pourquoi un élément est visualisé avec cette couleur ou ces marges, etc. Pour aider l'utilisateur, Amaya fournit une commande Montrer le style appliqué qui visualise dans une fenêtre externe les propriétés CSS appliquées au premier élément de la sélection courante.
L'utilisateur peut afficher le source CSS qui engendre chaque propriété en double (ou simple) cliquant sur la propriété. Aussi longtemps que la fenêtre est ouverte, Amaya met à jour le contenu de la fenêtre quand la sélection change.
En appuyant sur la touche F2, l'utilisateur peut ainsi voir les propriétés CSS appliquées aux éléments englobants. Quand l'utilisateur modifie la sélection en sélectionnant dans le chemin de la barre d'état affiché en bas de la fenêtre, les propriétés CSS appliquées sont aussi mises à jour.
Toutes les classes disponibles pour un document sont listées dans l'outil Appliquer classe.
Pour appliquer une classe à un élément :
Pour associer une classe ( attribut class) à un élément, vous pouvez également utiliser l'outil Attributs. Cet outil Attributs permet aussi de retirer l'attribut class d'un élément ou de le modifier (l'attribut class se manipule comme un autre attribut).
Pour retirer la classe d'un élément :
Quand l'élément est sélectionné, vous cliquez sur le [X] de l'entrée pour supprimer l'attribut class, ou vous cliquez sur l'entrée et éditez sa valeur puis confirmez avec le bouton appliquer ( ).
Pour retirer l'attribut class, vous cliquez dans la
valeur, F2
pour sélectionner la valeur entière, puis deux
Delete
pour détruire l'attribut.
Quand un attribut style a été associé à un élément, vous pouvez utiliser cet élément comme un modèle pour créer ou modifier une règle de style en utilisant la commande Créer une règle.
Pour créer un style générique pour un élément ou une classe :
Note : Vous devez sélectionner un seul
élément et cet élément doit avoir un attribut style
.
Le style de l'élément sélectionné est désormais associé au sélecteur
choisi et l'attribut style
est supprimé pour l'élément
sélectionné. Son contenu est déplacé à l'élément STYLE
, dans
le HEAD
document, et tous les éléments correspondant au
sélecteur sont visualisés dans le nouveau style.
Quand vous avez créé une nouvelles classes avec la commande Créer une règle, cette classe est automatiquement ajoutée à la liste de l'outil Appliquer une classe.
HTML définit certains éléments de niveau de caractère qui permettent d'associer du style aux chaînes de caractères. Deux entrées depuis le menu XHTML permettent de manier ces éléments HTML.
La commandeTypes information du menu XHTML présente un sous-menu offrant un choix d'éléments HTML qui définissent des styles abstraits.
Pour appliquer un des Eléments type information :
La chaîne de caractères sélectionnée reçoit le style correspondant.
Cinq de ces éléments sont également disponibles dans l'outil XHTML :
em ( ), stong ( ),
code
( ), ins ( ), del (
).
La commande Éléments caractères du menu XHTML offre un autre menu changeant le style du texte.
Pour appliquer un des Eléments caractères :
La chaîne de caractères sélectionnée reçoit le style correspondant.
Deux de ces éléments sont également disponibles dans l'outil XHTML : sup ( ), sub ( ).
Toutes les commandes des sous-menus Types information et Éléments caractères s'annulent si elles sont appliquées de nouveau.
Pour supprimer un élément style :
code
( ), ins ( ),