Feuille de style: petits mémos

Ce billet regroupe deux ou trois passages "standards" à retenir d’une feuille de style en cascade digne de ce nom.

Identificateurs CSS à garder sous le coude

html {
font-size: 100%; /* Taille par defaut du navigateur */
}

body {
font-size: 0.8em; /* Taille modifiable par le navigateur (unites = em) */
}

acronym{
border-bottom : 1px dotted #444444;
cursor : help;
}

#centrale {
/* hauteur minimale pour la boite centrale – IE ne comprends pas min-height – astuce */
/* Cf. http://forum.alsacreations.com/faq/#item60 */
/* height que pour IE */
height: 256px;
min-height: 256px;
}

/* Que pour autres navigateurs*/
html>body #centrale { /* non reconnu par IE */
height: auto;
min-height: 256px;
}

/* LIENS */
/* Attention: l’ordre precis 1 link, 2 visited, 3 hover, 4 active
est important pour que hover reste actif sur les liens visites */
a:link {
color: #4B5A9B;
background-color: transparent;
background-image: url(../images/dotted-bleu.gif);
background-repeat: repeat-x;
background-position: bottom;
text-decoration: none;
}
a:visited {
color: #666;
background-color: transparent;
background-image: url(../images/dotted-gris-666.gif);
background-repeat: repeat-x;
background-position: bottom;
text-decoration: none;
}
a:hover {
color: #F94E5A;
background-color: transparent;
background-image: url(../images/dotted-rouge.gif);
text-decoration: none;
}
a:active {
color: #FE9F34;
background-color: transparent;
background-image: url(../images/dotted-orange.gif);
text-decoration: none;
}

/* ENTETES H */

h1, h2, h3, h4, h5, h6 {
padding: 7px 0 7px 0;
margin: 0;
color:#555;
line-height: normal;
}

h1 {
font-size: 2.2em;
}

h2 {
font-size: 1.8em;
}

h3 {
font-size: 1.3em;
}

h4 {
font-size: 1.1em;
}

hr {
visibility: hidden;
clear: both;
}

Yiannis Girod

Yiannis Girod est administrateur de la société éponyme. Il est également formateur en informatique et créateur de sites web sous CMS (spécialiste Wordpress).