<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
  <title>Les feuilles de style</title>
  <meta name="GENERATOR" content="amaya V4.2.2" />
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body xml:lang="fr" lang="fr">

<table border="0" summary="toc">
  <tbody>
    <tr>
      <td><p><img alt="W3C" src="../images/w3c_home" /> <img
        alt="Amaya" src="../images/amaya.gif" /></p>
      </td>
      <td><p><a href="ImageMaps.html.fr" accesskey="p"><img
        alt="previous" src="../images/left.gif" /></a> <a
        href="Manual.html.fr" accesskey="t"><img alt="top"
        src="../images/up.gif" /></a> <a href="Attributes.html.fr"
        accesskey="n"><img alt="next" src="../images/right.gif"
        /></a></p>
      </td>
    </tr>
  </tbody>
</table>

<div id="Style">
<h2><a name="L1023">Les feuilles de style</a></h2>

<p>Le menu <strong>Style</strong> vous permet de changer l'apparence de vos
documents de deux façons différentes :</p>
<ul>
  <li>en utilisant les cascades des feuilles de style (CSS).</li>
  <li>en utilisant les éléments et les attributs HTML.</li>
</ul>

<p>Les premières entrées du menu <strong>Style</strong> sont consacrées aux
CSS et les deux dernières entrées aux <a href="#L1371">éléments HTML</a>.</p>

<h3><a name="Creating">Créer et mettre à jour un attribut de style</a></h3>

<p>Chacune des quatre entrées du menu <strong>Style</strong> appelle une boîte
de dialogue qui permet l'association d'un attribut de <code>style</code> aux
éléments courants sélectionnés :<strong></strong><strong></strong></p>
<ul>
  <li><h3><span style="font-size: 12pt"><span
    style="font-weight: normal">L'option</span> Style de caractères<span
    style="font-weight: normal">permet de choisir la police de caractère, le
    style du caractère, la taille du corps et le style
    souligné.</span></span></h3>
  </li>
</ul>
<ul>
  <li><strong><span style="font-weight: normal">L'option</span>
    Couleurs</strong> permet de choisir les couleurs du premier plan et de
    l'arrière plan dans la palette. Cliquez sur une cellule de la palette avec
    le bouton gauche de la souris pour attribuer la couleur du premier plan,
    cliquez sur le bouton du milieu pour attribuer la couleur de l'arrière
    plan.</li>
  <li>L'option <strong>Format</strong> permet de choisir l'alignement, le
    renfoncement, la justification et l'interligne.</li>
  <li>L'option <strong>Image de fond</strong> permet de choisir une image de
    fond et son mode de répétition.</li>
</ul>

<p>Dans toutes ces boîtes de dialogue, les boutons <strong>Défaut</strong>
permettent de supprimer l'information de style correspondant pour les éléments
sélectionnés.</p>

<p>Toutes les modifications faites avec ces boîtes de dialogue peuvent être
vues immédiatement dans la vue formatée et également dans la vue
structure.</p>

<h4>Changer la largeur et la hauteur des éléments</h4>

<p>La largeur et la hauteur de n'importe quel élément dans un document peuvent
être changées de façon intéractive, de la même façon que les <a
href="ImageMaps.html.fr#L1171">zones actives</a>. En tapant sur la touche
Control sur le clavier et en cliquant sur le bouton du milieu de la souris,
vous pouvez redimensionner la boîte associée à l'élément situé sous le
curseur. Quand vous lâchez le bouton de la souris, la taille de l'élément est
changée et un attribut <code>style</code> est associé à l'élément.</p>

<p>Quand l'élément redimensionné est une image, cette image est retaillée pour
remplir sa nouvelle boîte.</p>

<h3><a name="Creating,">Créer un style générique pour un élément ou une
classe</a></h3>

<p>Quand un attribut <code>style</code> 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. Sélectionnez cet élément (vous devez sélectionner un seul élément et
cet élément doit avoir un attribut <code>style</code>) et choisissez
<strong>Créer une règle</strong> depuis le menu <strong>Style</strong>. Une
boîte de dialogue surgit et visualise une liste de sélecteurs CSS. Cette liste
inclus toutes les classes qui sont définies pour le document courant, ainsi
que les types d'élément auquel le style est associé. Choisissez un sélecteur
dans cette liste ou entrez un nouveau nom de classe et cliquer sur le bouton
<strong>Confirmer</strong>. Le style de l'élément sélectionné est désormais
associé au sélecteur choisi et l'attribut <code>style</code> est supprimé pour
l'élément sélectionné. Son contenu est déplacé à l'élément <code>STYLE</code>,
dans le <code>HEAD</code> document, et tous les éléments correspondant au
sélecteur sont visualisés dans le nouveau style.</p>

<p>Quand vous avez créé de nouvelles classes avec la commande <strong>Créer
une règle</strong>, vous pouvez associer ces classes à certains éléments dans
le document. Choisissez <strong>Appliquer une classe</strong> depuis le menu
<strong>Style</strong>. Une boîte de dialogue surgit, affichant toutes les
classes existantes. Choisissez une de ces classes. Les éléments sélectionnés
sont désormais visualisés avec le style associé à la classe choisie.</p>

<p>Pour associer une classe à un élément, vous pouvez également utiliser le <a
href="Attributes.html.fr#L1073">menu <strong>Attributs</strong></a>. Ce menu
permet aussi d'effacer un attribut de classe pour un élément ou de le changer
: l'attribut de classe se manipule comme un autre attribut.</p>

<h3><a name="feuilles">Les feuilles de style CSS externes et les feuilles de
style CSS utilisateur</a></h3>

<p>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.</p>

<p>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 <strong>Feuille
de Style Utilisateur</strong> et est le fichier
local<strong>amaya.css</strong> conservé dans l'environement de l'utilisateur
(Le <a href="Configure.html.fr#AmayaHome">répertoire d'AmayaHome</a>). 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 :</p>
<pre>@media print {
 BODY {font-size: 10pt}
}
@media screen {
 BODY {font-family: Helvetica}
}</pre>

<h3><a name="Managing">Gérer des feuilles de style CSS externes</a></h3>

<p>L'entrée de feuilles de style donne accès à une série de commandes qui
permettent de contrôler les feuilles de style CSS externes et celles qui
donnent les préférences de l'utilisateur :</p>
<ul>
  <li>La commande <strong>Ajouter</strong> permet de lier une nouvelle feuille
    de style CSS à un document courant. On peut cliquer directement sur la
    cible de la feuille de style si elle est déjà visualisée dans la fenêtre
    Amaya. Si ce n'est pas le cas, l'utilisateur devra cliquer dans le
    document courant pour avoir accès à une boîte de dialogue et taper l'URL
    de la cible de la feuille de style. Cette commande ajoute un élément lien
    avec ses attributs à la tête du document.</li>
  <li>La commande <strong>Ouvrir</strong> permet d'ouvrir une des feuilles de
    style CSS appliquées au document courant.</li>
  <li>La commande <strong>Désactiver</strong> permet de supprimer les effets
    d'une des feuilles de style actives du document courant. Cette commande
    n'affecte en rien le lien CSS dans le document.</li>
  <li>La commande <strong>Réactiver</strong> permet de rétablir les effets
    d'une des feuilles de style CSS désactivées du document courant. Cette
    commande n'affecte en rien le lien CSS dans le document.</li>
  <li>La commande <strong>Retirer</strong> permet de retirer une des feuilles
    de style CSS externes. Cette commande agit comme la commande Désactiver.
    En plus de cela, l'élément lien qui attache les feuilles de style CSS est
    supprimé.</li>
</ul>

<p>Les commandes Ouvrir, Désactiver et Réactiver peuvent être appliquées aux
feuilles de style qui donnent les préférences de l'utilisateur, mais les
commandes Ajouter et Retirer concernent uniquement les feuilles de style
reliées. La figure suivante montre la liste des feuilles de style CSS
proposées pour la commande Ouvrir. Si aucune feuille de style CSS n'est
actuellement appliquée à un document, une boîte de dialogue expliquera
"qu'aucun fichier CSS n'est disponible".</p>

<p><img alt="css.gif" src="../images/css.gif" /></p>

<p></p>

<h3><a name="L1371">Mettre du style en utilisant des éléments HTML</a></h3>

<p>HTML fournit 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
<strong>Style</strong> permettent de manier ces éléments HTML.</p>

<h4>Créer des éléments de style HTML</h4>

<p>La commande<strong>Types information</strong> du menu
<strong>Style</strong> présente un sous-menu offrant un choix d'éléments HTML
qui définissent des styles abstraits. Sélectionnez tout d'abord une chaîne de
caractères dans votre page et ensuite choisissez une commande dans ce menu. La
chaîne de caractères sélectionnée reçoit le style correspondant. Trois de ces
styles sont également disponibles par l'intermédiaire des boutons :
<em>emphasis</em> (<img src="../images/Em.gif" alt="Emphasis button" />),
<strong>strong</strong> (<img src="../images/Strong.gif" alt="Strong button"
/>) and <code>code</code> (<img src="../images/Cour.gif" alt="Code button"
/>).</p>

<p>La commande<strong>Éléments caractères</strong> du menu
<strong>Style</strong> offre un autre menu changeant le style du texte. Les
premières entrées de ce menu peuvent être remplacées par CSS et ne devraient
pas être utilisées. Elles sont là uniquement pour se conformer à
l'implémentation de HTML 3.2.</p>

<h4>Supprimer le style</h4>

<p>Pour supprimer le style d'une chaîne de caractères, sélectionnez tout
d'abord la chaîne et appliquez de nouveau la commande qui a été utilisée pour
associer le style que vous voulez supprimer. Toutes les commandes des
sous-menus <strong>Types</strong> <strong>information</strong> et
<cite></cite><strong>Éléments caractères</strong> s'annulent si elles sont
appliquées de nouveau.</p>
</div>

<p><a href="ImageMaps.html.fr"><img alt="previous"
src="../images/left.gif" /></a> <a href="Manual.html.fr"><img alt="top"
src="../images/up.gif" /></a> <a href="Attributes.html.fr"><img
alt="next" src="../images/right.gif" /></a></p>
<hr />
</body>
</html>
