SELFHTML/Aides à la navigation Feuilles de style CSS Définir des formats CSS

	Unités de mesure, mentions de couleur et affectation de valeurs
	Mentions numériques  Mentions de couleur  Mentions de valeurs autorisées et mentions de chaînes de caractères  Mentions numériques pour la restitution vocale

 Mentions numériques

Les unités de mesure les plus répandues sont à votre disposition Pour toutes les données numériques dans les feuilles de style CSS à savoir par exemple pour les tailles de police, les espaces entre paragraphes ou les marges. Sont possibles des données absolues (par exemple millimètre) ou des données relatives (pourcentage par rapport à normal). Utilisez pour vos mentions les abréviations suivantes:

Utilisez toujours le point comme signe décimal à la place de la virgule pour les mentions numériques avec décimales, donc par exemple 0.2cm et non pas 0,2cm. Même des mentions négatives sont possibles pour quelques affectations de valeur; elles sont précédées comme d'habitude du signe moins.

Vous pouvez donc noter des mentions très exactes, cependant les pages Web sont restituées en règle générale sur des écrans, et les écrans se composent aujourd'hui de pixels, et la densité en pixels peut varier très sensiblement d'un écran à l'autre. En fin de compte l'ordinateur doit convertir vos mentions en pixels pour l'écran. Ce qui peut mener à des résultats décevants. Ainsi des tailles de police bien lisibles sur un écran peuvent-elles être trop petites dans un autre environnement. Malheureusement les différences dans les réglages de base des systèmes d'exploitation ont aussi leur part de responsabilité. Ainsi, avec des systèmes tournant sous Windows, une base de calcul de 96dpi (Dots per Inch - points par pouce) est utilisée pour la représentation de polices (avec un réglage "grandes polices" c'est même 120dpi), avec des systèmes tournant sous Linux et Macintosch, c'est par contre 72dpi. C'est pour cette raison que des tailles de police qui paraissent nettes sous Windows, paraîtront faibles sous les autres systèmes nommés, alors que des tailles de police qui font bonne figure sous ces derniers, seront à leur tour pataudes sous Windows. Mais même des mentions directes en pixels ne résolvent pas forcément le problème. Un pixel sur l'écran 13 pouces avec une résolution de 1024×768 pixels d'un ordinateur portable aura un effet tout à fait différent qu'un pixel sur l'écran 19 pouces d'un ordinateur de bureau avec la même résolution d'écran. D'autres mentions telles que em ou bien des valeurs en pourcentage, évitent certes le problème des différentes représentations à l'écran - mais premièrement on peut à peine parler de "formatage" avec une mention comme 1.2em , et deuxièmement ces mentions préparent aussi des problèmes d'une autre nature. Ainsi par exemple, il peut arriver par le principe de l'héritage naturel que des polices, avec des éléments imbriqués plusieurs fois (par exemple pour des listes ou des tableaux), deviennent toujours plus petites ou toujours plus grandes. Certes CSS 2.0 propose avec les possibilités étendues de  définir des formats pour les repères HTML imbriqués , des mesures pour y remédier, qui ne servent toutefois à rien aussi longtemps qu'elles ne fonctionneront pas dans beaucoup des navigateurs très répandus.

Eu égard à tous ces problèmes, une véritable guerre de religion s'est déjà déclenchée dans certains milieux pour trancher quelles sont les "bonnes" et quelles sont les "mauvaises" mesures. Les uns prétendent qu'on devrait s'en tenir à des mentions telles que pt, parce qu'un point doit toujours avoir la même taille, les autres jurent leurs grands dieux que la mention em est salvatrice. La réalité en tous cas est que vous ne devez jamais vous fier à ce que des tailles qui paraissent splendides sur votre écran, soient tout aussi splendides ailleurs. Pour cette raison évitez avant tout pour les mentions déterminantes pour la lisibilité du texte, des valeurs "extrêmes", et réagissez si vous entendez de toutes parts qu'il est difficile de lire vos pages.

Tip:

Quand vous voulez convertir entre différentes unités de mesure, vous pouvez utiliser le  convertisseur point/pouce/millimètre.

 Mentions de couleur

Les mentions de couleur dans les feuilles de style sont possibles d'après les règles de syntaxe CSS pour  définir les couleurs en HTML. Vous pouvez mentionner des valeurs de couleur donc hexadécimales d'après le schéma #XXXXXX, mais aussi utiliser les noms de couleur répandus.

Une possibilité supplémentaire pour définir les couleurs est pourtant offerte par le langage de feuilles de style CSS. Cette possibilité a le schéma rgb(rrr,ggg,bbb). L'expression rgb(...) est toujours la même. Dans les parenthèses doivent figurer trois valeurs décimales ou trois pourcentages, séparés les uns des autres par des virgules. rrr est la valeur du rouge, ggg la valeur du vert et bbb la valeur du bleu de la couleur. Pour les trois valeurs sont autorisés soit des chiffres absolus compris entre 0 (pas de couleur correspondante) et 255 (valeur maximale de la couleur correspondante) soit des valeurs en pourcentage de 0% (pas de couleur correspondante) à 100% (valeur maximale de la couleur correspondante).

Exemples:

<style type="text/css">
<!--
h1 { color:#FFCCDD; background-color:black }
body  { background-color:rgb(51,0,102); }
blockquote  { background-color:rgb(60%,90%,75%); }
//-->
</style>

 Noms de couleur relatifs à l'utilisateur

À partir de la version 2.0 du langage CSS, il y a encore la possibilité d'utiliser des noms de couleur spécifiques à l'utilisateur, derrière lesquels se cachent des couleurs que l'utilisateur a réglé sur son ordinateur comme environnement de travail. De cette façon vous pouvez utiliser des couleurs qui correspondront aux couleurs choisies par l'utilisateur pour son écran pour structurer vos pages et cela sans que vous ne connaissiez ces couleurs. Les noms de couleurs spécifiques à l'utilisateur qui sont permises sont expliquées ci-après.

Exemples:

<style type="text/css">
<!--
h1 { color:windowtext; background-color:infobackground; }
body  { background-color:appworkspace; }
//-->
</style>

 Mentions de valeurs autorisées et mentions de chaînes de caractères

Pour beaucoup de mentions de feuilles de style existe un choix de valeurs autorisées. Ce n'est pas différent du cas de beaucoup de repères HTML. Exactement comme vous pouvez aligner un titre ou un paragraphe de texte en HTML avec les mentions align="left", align="center" ou bien align="right", il y a des mentions de feuilles de style qui attendent certains mots clé. Ainsi il y a par exemple la mention de feuille de style text-align pour l'alignement de texte qui attend les mêmes paramètres, donc left, center ou bien right.

Quelques mentions de feuilles de style attendent la mention d'un nom ou même de plusieurs mots clé. Ainsi, derrière la mention de feuilles de style font-family vous pouvez noter les noms d'une ou de plusieurs polices que vous désirez employer pour le formatage. D'autres mentions de feuilles de style sont des résumés de mentions distinctes. Ainsi par exemple, il y a la mention border (bordure), derrière laquelle vous pouvez noter une mention comme thin solid red. Séparez plusieurs mentions d'une propriété de feuilles de style par des espaces. Quand les mentions elles mêmes contiennent des espaces comme par exemple des noms de polices, vous pouvez utiliser des virgules pour séparer. Dans de tels cas les guillemets sont aussi recommandés.

Pour les noms comme les mentions de polices ou des mentions telles que left, center etc... il importe peu, tout au moins pour l'emploi des CSS. que vous notiez ces mentions en minuscules ou en majuscules . Ce qui s'applique également aux propriétés de feuilles de style elles-mêmes. Toutefois si vous utilisez les CSS sur des documents XHTML ou XML valides, il vous faut écrire les noms d'éléments, les noms d'attributs et les affectations de valeur tels qu'ils sont fixés dans le DTD XML. Pour XHTML tout doit être écrit en minuscules.

Exemples:

<style type="text/css">
<!--
p { font-family:"Comic Sans MS",Arial; text-align:center; }
body  { border:thin dashed silver; background-color:black; }
DIV.SPECIAL { BORDER:THICK DOUBLE RGB(0,64,128); }
blockquote[title="Citation de Corneille"] { color:#000080; }
//-->
</style>

 Mentions numériques pour la restitution vocale

Pour les propriétés CSS concernant le  contrôle du son pour la restitution vocale, qui n'est cependant, à l'heure actuelle, pas soutenue par les navigateurs, les mentions suivantes de mesure du domaine de l'acoustique et de la mesure du temps sont employées:

	Formatage de la police
	Formater directement des éléments HTML

SELFHTML/Aides à la navigation Feuilles de style CSS Définir des formats CSS

© 2001 Stefan Münz / © 2003 Traduction  Serge François, 13405@free.fr
 selfhtml@fr.selfhtml.org