SELFHTML/Aides à la navigation Feuilles de style CSS Propriétés CSS |
Fenêtre d'affichage | |
Généralités sur la fenêtre d'affichage |
|
Sur la fenêtre d'affichage, on peut déjà dire que c'est une partie de l'environnement de travail de l'utilisateur et non pas une place de jeux pour les ébats des auteurs de pages Web. La seule propriété de la fenêtre d'affichage à laquelle le consortium W3 permet l'accès est l'apparence du curseur. Cela se justifie en ce sens qu'il contribue activement à la fonctionnalité des pages Web.
Sur le bien-fondé des propriétés CSS dont Microsoft a doté l'Explorer Internet depuis la version 5.5, on peut avoir une opinion plus nuancée. Dans le cadre des concepteurs Web partisans, il peut être judicieux que les barres de défilement de la fenêtre du navigateur ou bien celles de champs de saisie à plusieurs lignes de formulaire s'accordent aux autres couleurs. D'un autre côté ces possibilités font naître de nouvelles envies chez ces gens qui aimeraient pouvoir grâce à leurs pages Web, allumer et éteindre l'ordinateur de l'utilisateur. Car naturellement ils veulent aussi ensuite mettre en forme la barre de menus et la barre d'outils du navigateur.
Vous pouvez définir un curseur pour un élément HTML. Si l'utilisateur passe avec la souris sur la surface occupée par l'élément, le curseur prend la forme mentionnée. Étant donné que les curseurs doivent toujours être liés à une signification, il est judicieux dans la pratique de lier de tels éléments à un Script à l'aide d'Event-Handler de JavaScript qui exécute alors certaines commandes.
<html><head><title>cursor</title> </head><body bgcolor="#FFFFFF" text="#000000"> <div style="background-color:#F8F8FF; padding:10pt; border:thin solid black; width:100%; cursor:crosshair;"> <p>Ceci est un passage avec la mention <b>cursor:crosshair</b>. Passez avec la souris sur ce passage.</p></div> <!--etc...--> </body></html> |
Avec cursor:
vous pouvez modifier l'apparence du curseur pour le
cas où l'utilisateur passerait la souris sur le passage correspondant. Les
mentions suivantes sont permises:
auto
= curseur automatique (réglage normal).
default
= curseur standard indépendant de la plate-forme.
crosshair
= curseur de la forme d'une simple croix.
pointer
= curseur de la forme d'une flèche.
move
= curseur de la forme d'une croix signalant la possibilité de déplacer l'élément.
n-resize
= curseur de la forme d'une flèche pointant vers le haut (n = nord).
ne-resize
= curseur de la forme d'une flèche pointant vers le haut à droite (ne = nord-est).
e-resize
= curseur de la forme d'une flèche pointant vers la droite (e = est).
se-resize
= curseur de la forme d'une flèche pointant vers le bas à droite (se = sud-est).
s-resize
= curseur de la forme d'une flèche pointant vers le bas (s = sud).
sw-resize
= curseur de la forme d'une flèche pointant vers le bas à gauche (sw = sud-ouest).
w-resize
= curseur de la forme d'une flèche pointant vers la gauche (w = ouest).
nw-resize
= curseur de la forme d'une flèche pointant vers le haut à gauche (nw = nord-ouest).
text
= curseur sous une forme qui symbolise du texte normal.
wait
= curseur sous la forme d'un symbole signalant l'attente.
help
= curseur sous forme d'un symbole qui signale de l'aide pour
l'élément.
url([fichier])
= curseur au choix, [fichier] doit être un graphique GIF ou JPG.
Ne détournez pas les symboles de curseurs de leur finalité. Si par exemple vous utilisez cursor:move
pour un élément, cet élément doit pouvoir être aussi effectivement déplacé (par exemple à l'aide de HTML dynamique)), et si vous utilisez cursor:help
l'utilisateur attend
qu'en cliquant sur le passage une fenêtre ou un passage avec un texte d'aide
apparaisse à l'écran.
Netscape 6.x et l'Explorer Internet 5.x n'interprètent pas la mention url([fichier])
.
Les propriétés décrites ici peuvent être utilisées sur des éléments comme body
ou bien textarea
. Avec body
elles fixent les couleurs des barres de défilement de la fenêtre, avec textarea
les couleurs des barres de défilement du passage de saisie.
<html><head><title>scrollbars</title> <style type="text/css"> body, textarea { background-color:#8C8CC6; color:#FFFFFF; font-family:"Andale Mono",Arial,sans-serif; scrollbar-base-color:#8C8CC6; scrollbar-3dlight-color:#FFFFFF; scrollbar-arrow-color:#FFFFFF; scrollbar-darkshadow-color:#000000; scrollbar-face-color:#8C8CC6; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#000000; scrollbar-track-color:#ACACE6; } </style> </head><body> <h1 style="text-decoration:underline">Ton sur ton</h1> <form name="page"> <p>Vous pouvez écrire vous-même le texte de cette page:</p> <textarea name="texte" cols="80" rows="200"></textarea> </form> </body></html> |
Avec les propriétés suivantes, vous pouvez spécifier les différentes parties des barres de défilement:
scrollbar-base-color
= couleur de base des barres de défilement
scrollbar-3dlight-color
= couleur pour les effets de relief (3D)
scrollbar-arrow-color
= couleur pour les pointeurs de défilement
scrollbar-darkshadow-color
= couleur pour les ombres
scrollbar-face-color
= couleur pour la surface
scrollbar-highlight-color
= couleur pour le bord haut et le bord gauche
scrollbar-shadow-color
= couleur pour le bord droit et le bord du bas
scrollbar-track-color
= couleur pour la barre de défilement non-cachée par le pointeur de défilement
Pour toutes ces propriétés une mention de couleur est possible.
Filtres (seulement Microsoft) | |
Contrôle du son pour sortie vocale | |
SELFHTML/Aides à la navigation Feuilles de style CSS Propriétés CSS |
© 2001 Stefan Münz / © 2003 Traduction Serge François, 13405@free.fr
selfhtml@fr.selfhtml.org