SGS : Système de Gestion de Site
actu.css
Comme son nom l'indique actu.css permet de traiter l'ensemble des css qui gèrent l'affichage du bloc actu
.actu
{
width:100%;
padding:4px;
}

Ici on définit avant tout la manière dont le bloc actu va occuper la page (entendre ici le bloc Page) avec l'instruction width, pour le reste tout est permis !
.actu_cell
{
width:100%;
}

Les instructions communes à toutes les cellules d'un bloc actu, ensuite nous passons au détail.
.actu_cell_theme, .actu_cell_titre, .actu_cell_soustitre, .actu_cell_post, .actu_cell_texte
Ces css définissent les caractéristiques spécifiques à chaque cellule du bloc actu. L'exemple étant la meilleure façon de comprendre voici les css des cellules du bloc actu de ce site :

.actu_cell_theme
{
text-align:left;
}
.actu_cell_titre
{
text-align:left;
border-top: 1px solid steelblue;
padding-top:3px;
}
.actu_cell_soustitre
{
text-align:left;
padding-left:10px;
}
.actu_cell_post
{
text-align:right;
border-top: 1px solid steelblue;
padding-top:3px;
}
.actu_cell_texte
{
width:100%;
padding: 5px;
border-bottom: 1px solid steelblue;
}
Haut de page
.actu_post, .actu_theme, .actu_titre, .actu_soustitre, .actu_texte
Cess css définissent le texte des différentes cellules du bloc actu. Encore un exemple :

.actu_post
{
font-family: Verdana, Arial, Helvetica,sans-serif;
text-align:right;
font-size: 10px;
font-style: italic;
font-weight: none;
text-decoration: none;
}
.actu_theme
{
color: steelblue;
font-family: Verdana, Arial, Helvetica,sans-serif;
font-size: 10px;
font-style: normal;
font-weight: bold;
text-decoration: none;
text-align:left;
padding:1px;
padding-right:10px;
padding-left:10px;
border-top-color: steelblue;
border-top-width: 1px;
border-top-style: solid;
border-right-color: steelblue;
border-right-width: 1px;
border-right-style: solid;
border-left-color: steelblue;
border-left-width: 1px;
border-left-style: solid;
}
.actu_titre
{
padding-left:5px;
color: black;
font-family: Verdana, Arial, Helvetica,sans-serif;
font-size: 12px;
font-style: italic;
font-weight: bold;
text-decoration: none;
text-align:left;
}
.actu_soustitre
{
color: black;
font-family: Verdana, Arial, Helvetica,sans-serif;
font-size: 10px;
font-style: normal;
font-weight: bold;
text-decoration: none;
text-align:left;
}
.actu_texte
{
color: black;
font-family: Verdana, Arial, Helvetica,sans-serif;
font-size: 10px;
font-style: normal;
font-variant: normal;
font-weight: normal;
text-decoration: none;
}

Pour les deux série de css précédentes (cellules & texte) le nom de chacune d'entre elle correspond bien sûr à son contenu :

• post correspond à l'affichage de la date de mise en ligne de l'actu.
• theme correspond à l'affichage du thème de l'actu.
• titre correspond à l'affichage du titre de l'actu.
• soustitre correspond à l'affichage du titre de l'actu.
• texte correspond à l'affichage du texte de l'actu.

Logique… Pour nous en tout cas ;o)
Haut de page
SGS  ©2004 - Manuel en ligne