SELFHTML/Quickbar
Feuilles de style CSS
Définir des feuilles de style SELFHTML/Quickbar
Feuilles de style CSS
Définir des feuilles de style
 |
Unités de mesure, mentions de couleur et règles |
|
|
 | |
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 à votre disposition les unités de mesure les plus répandues. 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:
pt pour point (= 1/72 pouce)
pc pour Pica (= 12 points)
in pour pouce (= 2,54 cm)
mm pour millimètre
cm pour centimètre
em pour "en relation avec la taille de police propre à
l'élément"
ex pour "en relation avec la hauteur de la lettre x
propre è l´élément"
px pour pixel (donnée relative du point de vue des
différentes résolutions d'écran chez les utilisateurs)
% pour pourcentage par rapport à la norme de l'élément
Utilisez toujours le point pour les valeurs décimales et non pas la virgule, à savoir par exemple 0.2cm et non pas 0,2cm.
<style type="text/css">
<!--
h1 { font-size:24pt; margin-top:1.2cm; margin-left:30px; }
h2 { font-size:18pt; margin-top:130%; margin-left:1.2in; }
p { font-size:12pc; text-indent:14mm; margin-left:3em; }
//-->
</style>
|
Si vous voulez convertir des unités distinctes entre elles, vous pouvez
utiliser le 
convertisseur point/pouce/millimètre.
|
Les mentions de couleur dans les feuilles de style d'après la syntaxe CSS
suivent largement les règles 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 part de la couleur correspondante) et 255 (part maximale de la valeur correspondante) soit des valeurs en pourcentage de 0% (pas de part de la couleur correspondante) à 100% (part maximale de la couleur correspondante).
À 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 sous l´exemple suivant.
<style type="text/css">
<!--
h1 { color:#FFCCDD; background-color:black }
body { background-color:rgb(51,0,102); }
blockquote { background-color:rgb(60%,90%,75%); }
div { background-color:infobackground; }
//-->
</style>
|
Les noms de couleurs suivants sont permis:
activeborder = couleur de la ligne de titre de la fenêtre active.
activecaption = couleur du titre de la ligne de titre de la fenêtre
active.
appworkspace = couleur de l'arrière plan de la fenêtre active.
background = couleur de l'arrière plan du bureau.
buttonface = couleur des boutons dans les boites de message.
buttonhighlight = couleur pour les ombrages en 3D des boutons dans les boites de message.
buttontext = couleur du texte des inscriptions de boutons dans les boites de message.
captiontext = couleur des titres dans les boites de message.
greytext = couleur du texte désactivé dans les boites de message
highlight = couleur des éléments choisis dans des listes de choix.
highlighttext = couleur du texte sélectionné.
inactiveborder = couleur d'une ligne de titre d'une fenêtre non active.
inactivecaption = couleur du titre dans la ligne de titre d'une
fenêtre non active.
infobackground = couleur pour les bulles infos et les Hints (petites
aides déroulantes).
infotext = couleur du texte pour les bulles infos et les Hints (petites
aides déroulantes).
menu = couleur pour les barres de menu.
menutext = couleur pour les éléments de menu.
scrollbar = couleur de la barre de défilement dans les fenêtres.
threeddarkshadow = couleur sombre pour les ombrages d'éléments 3D.
threedface = couleur d'éléments 3D.
threedhighlight = couleur d'éléments 3D venant d'être cliqués.
threedlightshadow = couleur claire pour les ombrages d'éléments 3D.
threedshadow =couleur sombre pour les ombrages d'éléments 3D.
window = couleur d'arrière plan pour les fenêtres de document v.
windowframe = couleur de cadres de fenêtre.
windowtext = couleur de texte normal dans des fenêtres de document.
Pour définir les couleurs vous pouvez utiliser l' instrument
de choix de couleur.
|
|
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 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 right.
Quelques mentions de feuilles de style attendent la mention ou aussi 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 (cadre), 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 polices, vous pouvez utiliser des virgules pour séparer. Dans de tels cas les guillemets sont aussi recommandées. Votre attention sera attirée aux endroits correspondants de cette documentation.
Pour les noms comme les mentions de polices ou des mentions telles que left, center etc..., il importe peu que vous notiez ces mentions en minuscules ou en majuscules. Ceci est également valable pour la propriété de feuilles de style elle même.
<style type="text/css">
<!--
p { font-family:"Comic Sans MS",Arial; text-align:center; }
body { BORDER:THIN DASHED SILVER; background-color:black; }
div.spezial { border:thick double rgb(0,64,128); }
//-->
</style>
|
|
| |
après: |
Mentions de feuilles de style: formatage de police
|
avant: |
Formatage rapide dans le texte
|
SELFHTML/Quickbar
Feuilles de style
CSS Définir
des feuilles de style
Serge François, 13405@free.fr