GÉNÉRAL
INDEX
Calendrier
Préférences

Se reconnecter
---

Votre nom (ou pseudo) :

Votre mot de passe


 Nombre de membres 40 membres


Connectés :

( personne )
Visites

 118331 visiteurs

 7 visiteurs en ligne

Structure - Les classes

Extrait de la feuille de style, pour visualiser les class permettant les différents attributs de chaque bloc :

Document

html {
  font: 12px Arial, Helvetica, sans-serif;
  color: #808080;
  background: #FFFFFF;
}
body { corps du document
  margin: 0;
  font: 12px Arial, Helvetica, sans-serif;
  color: #808080;
  background-color: #FFFFFF;
}
a { lien dans tout le document
  color: #F58309;
  background: inherit;
  text-decoration: none;
}
a:hover { lien survolé dans tout le document
  color: #1E8FFF;
  text-decoration: none;
  font-weight: bold;
  background-color: inherit
}
p { paragraphe dans tout le document
  margin: 4px 0px;
}
hr { ligne horizontale
  border-style : none none solid;
  height: 0px;
  border-width : 0px 0px 1px;
  border-color : #D2D2D2;
  width: 98%;
}
ul, ol { listes dans tout le document
    padding:0;
    margin:0;
}

h1 { titre niveau 1
    font-size: 24px;
}
h2 { titre niveau 2
    font-size:18px;
}
h3 { titre niveau 3
    font-size:16px;
}
h4 { titre niveau 4
    font-size:14px;
}
.bordure { bordure du document
  border: 0px solid ;
}

MISE EN PAGE DES BLOCS DANS L'ENTETE (#headTop et #headBottom)

Logo
div.logo {
    background-color: transparent;
    padding: 4px;
    text-align: left;
}

Bannières
div.banner {
    background-repeat: no-repeat;
    padding: 8px;
    text-align: right;
}

Citations
div.quote {
    width: 100%;
    white-space: nowrap;
    text-align: center;
}

div.quote strong { titre de la citation
    font-weight:bold;
}

div.quote cite { texte de la citation
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #1E8FFF;
    font-style: normal;
    text-align: center;
    width: 100%;
    border: 0;
    margin: 0;
    padding: 0;
}

div.quote span.author { auteur de la citation
    font-style: normal;
}

Barre du menu

div.menuIcons {
    padding:10px;
}

div.menuIcons ul { liste du menu
    margin:0;
    padding:0;
    list-style:none;width:100%;
}

div.menuIcons ul li { toutes les sections du menu
    float:left;
    margin-right:20px;
    text-align:center;
}

div.menuIcons ul li span { toutes les sections du menu
    display:block;
    white-space:nowrap;
}

div.menuIcons ul li.menu_flags { section drapeau du menu
    float:left;
    margin-right:20px;
    text-align:center;
}

div.menuIcons ul li.menu_flags img { séparation drapeau
    margin:3px;
}

div.menuIcons ul li.menu_admin { section admin
    float:right;
}

div.menuIcons ul li span { nom des sections du menu
    color: #1E8FFF;
    white-space:nowrap;
}

div.menuIcons ul li a span { lien du menu
    color: #F58309;
    text-decoration: none;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
}

div.menuIcons ul li a:hover span { lien survolé du menu
    color: #00CC00;
    text-decoration: none;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
}

MISE EN PAGE DES BLOCS DANS LE BLOC PRINCIPAL (#mainContent)

Boîte d'articles 1 et 2

.titrebox { titre de la boîte latérale des articles
    background-color: transparent;
    border: 0 solid #FFFFFF;
    padding: 4px;
    white-space: nowrap;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #00CC00;
    text-align: left;
    font-weight: bold;
}

.tblbox corps de la boîte latérale des articles
    background-color: #FFFFFF;
    border: 0px solid #F58309;
    padding: 4px;
    margin-bottom: 8px;
    text-align:left;
}

.tblboxover { corps survolé de la boîte latérale des articles
    background-color: inherit;
    border: 0px solid #F58309;
    padding: 4px;
    margin-bottom: 8px;
    text-align:left;
}

Boîte centrale

.titre { titre de la boîte centrale
    background-color: #C0C0C0;
    border: 0px solid #F58309;
    padding: 5px;
    white-space: nowrap;
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    color: #404040;
    text-align: left;
    font-weight: bold;
}
.tbl { corps de la boîte centrale
    background-color: #FFFFFF;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    border: 1px solid #F58309;
    padding: 5px;
    margin-bottom: 8px;
    text-align:left;
}
.tblover { corps survolé de la boîte centrale
    background-color: #FFFFFF;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    border: 1px solid #F58309;
    padding: 5px;
    margin-bottom: 8px;
    text-align:left;
}

Bloc Menu dans une boîte latérale

ul.boxmenu { liste du menu
    margin:0;
    padding:10px;
    list-style:none;
}

ul.boxmenu li { items de la liste du menu
    margin-bottom:10px;
}

ul.boxmenu li img { icônes du menu
    vertical-align:middle;
    margin-right:10px;
}

Boîtes Articles 1 et 2 (menu list, menu dynamic 1, menu dynamic 2)

Note : ces paramètres ne sont pas pris en compte par les "menus Extra" du plugin Ajoute-menu

p.rubr { catégories des articles
    background-color: transparent;
    padding: 4px 2px;
    margin: 1px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #1E8FFF;
    text-align:left;
}
ul.item { liste des articles
    margin:0;
    padding:0;
}
ul.item li.item { titres des articles
    background-color: transparent;
    padding: 2px 0px 2px 10px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    text-align:left;
    list-style: none;
}

ul.item li.curr_item { titre dont l'article est affiché
    background-color: transparent;
    padding: 2px 0px 2px 10px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #F58309;
    text-align:left;
    list-style: none;
}

Blocs forum et tables

.forum {
    background-color: #C0C0C0;
    padding: 5px 5px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #404040;
    text-align: center;
    font-weight: bold;
}
.forum2 {
    background-color: E1E1E1;
    padding: 5px 5px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    text-align:left;
}
tr.forum2 {
    background-color: #D6D2D2;
    padding: 5px 5px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    font-weight: bold;
    text-align:left;
}
.quest {
    background-color: #E1E1E1;
    padding: 5px 5px 5px 5px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    text-align:left;
}
.rep {
    background-color: #D6D2D2;
    padding: 10px 5px 5px 5px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    text-align:left;
}
.bord {
    border: 0px solid #808080;
    padding: 1px;
}
.bord2 {
    border: 2px double #808080;
}

Calendrier

.cal {
    border-collapse: separate;
    border: 1px solid #808080;
    border-spacing: 0px;
    background-color: #FFFFCC;
}
tr.cal { mois
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #1E8FFF;
    background-color: #FFFFCC;
    text-align: center;
}
td.cals { 1ère lettre des jours de la semaine
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    background-color: #FFFFCC;
    width: 14%;
    text-align: center;
}
td.cal0 { cellules vides
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    width: 14%;
    text-align: center;
}
td.cal1 { tous les jours (chiffres)
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    background-color: #FFFFCC;
    width: 14%;
    text-align: center;
}
td.cal2 { aujourd'hui
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #00CC00;
    background-color: FFFFCC;
    width: 14%;
    text-align: center;
}
td.cal3 { dimanche ou jour férié
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    background-color: #FFFFCC;
    width: 14%;
    text-align: center;
}
td.cal4 { aujourd'hui si dimanche ou jour férié
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    background-color: #FFFFCC;
    width: 14%;
    text-align: center;
}
td.calevt { événement
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #F58309;
    background-color: #F9C063;
    text-decoration: bold;
    text-align: center;
    width: 14%;
}

Formulaires

form {
    margin: 3px 0px;
}
fieldset { Encadrement des champs
    border: 1px solid #808080;
    margin: 8px;
}
legend { légende des encadrements
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    font-weight: bold;
}
input.bouton, button { bouton
    cursor: pointer;
    margin: 4px 0px;
    color: #808080;
    border: 1px solid #808080;
    background-color: #C0C0C0;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
}
input.texte { saisie du texte dans le champ dans la boîte recherche
    background-color: #FFFFFF;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
    border: 1px solid #808080;
    margin: 4px 0px;
}
select { sélection d'un champ
    color: #808080;
    background-color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    border: 1px solid #808080;
    margin: 4px 0px;
}
textarea { saisie du texte dans le livre d'or, le forum, le blog
    color: #808080;
    background-color: #FFFFFF;
    border: 1px solid #808080;
    overflow: auto;
    scrollbar-base-color: #C0C0C0;
    scrollbar-arrow-color: #808080;
    margin: 4px 0px;
}

Editeur FckEditor

.Code {
    border: 1px solid #808080;
    padding-right: 5px;
    padding-left: 5px;
    color: #808080;
    font-family: Arial, Helvetica, sans-serif, Monospace;
    font-size: 11px;
    background-color: #FFFFFF;
}

MISE EN PAGE DES BLOCS DANS LE PIED-DE-PAGE (#foot)

#foot span.copyright {  Copyright
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.8em;
    color: #404040;
}

AUTRES

.htable {
    margin-bottom: 8px;
}
.htable1 {
    margin-bottom: 8px;
}
.htable2 {
    padding: 0px 2px;
}

Boîte latérale autre que boîte d'articles

.titrebox2 { titre de la boîte latérale autre que boîte d'articles
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #1E8FFF;
    font-weight: bold;
    text-align: center;
}

.box { corps de la boîte latérale autre que boîte d'articles
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
}

p.boxconfused y'a des subtilités qui m'échappent !
    margin: 0px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #808080;
}

.bordure { bordure de la boîte latérale autre que boîte d'articles
    border: 0px solid #808080;
}

a.box { lien dans les boîtes latérales autre que boîte d'articles
    color: #F58309;
    text-decoration: none;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
}
a.box2 { cryune autre subtilité...
    color: #1E8FFF;
    text-decoration: none;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
}
a:hover.box { lien survolé dans les boîtes latérales autre que boîte d'articles
    color: #F58309;
    text-decoration: bold;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
}

 Boîte RSS

a.pop {
    position: relative;
}
a.pop span {
    display:none;
}
a.pop:hover span {
    display:block;
    position:absolute;
    top:2em;
    left:2em;
    color: #808080;
    background-color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border: 1px solid #808080;
    padding: 4px;
}

Divers

.top { "haut" placé juste au-dessus du Copyright
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.8em;
    text-align: center;
}
.timer { temps d'affichage de la page
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
    font-style: italic;
    color: #808080;
    text-align: center;
    padding: 8px;
}
.clsCursor {
    cursor: pointer;
}

.notice {
    color:red;
    background-color:yellow;
    padding:2px;
}
.spacer {
    padding: 8px 2px;
}

rolleyes "caption"... pas vraiment certaine de ce que c'est...

.caption {
    font: bold 11px verdana, tahoma, arial, helvetica, sans-serif;
    background-color: #FFFFFF;
    padding: 4px 10px 4px 10px;
    margin:0px 0px 0px 6px;
    position: relative; top: 6px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #999;
}
.caption2 {
    font: bold 11px verdana, tahoma, arial, helvetica, sans-serif;
    background-color: #FFFFCC;
    padding: 4px 10px 4px 10px;
    margin:0px 0px 0px 6px;
    position: relative; top: 6px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #999;
}

confused De quelles tables s'agit-il ?

.bodytable { corps de la table
    border: 0px solid #808080;
    padding: 16px 4px 2px;
    margin: 0px 0px 4px;
    font: 10px verdana, tahoma, arial, helvetica, sans-serif;
    color: #808080;
    border-right: 0px solid #ccc;
    border-bottom: 0px solid #999;
}

ul.art { liste dans la table
    font-weight:bold;
    padding:0px;
    margin:0px;
}
li.art { items de la liste dans la table
    font-weight:normal;
    list-style-type:none;
    padding:0px;
    margin-left:4px;
}

Bandeau

.band {
}

Date de création : 30/06/2007 @ 20:34
Dernière modification : 02/07/2007 @ 15:59
Catégorie : Structure
Page lue 2934 fois


Prévisualiser Prévisualiser     Imprimer l'article Imprimer l'article


  Un jour à la fois !   (Inconnu)
^ Haut ^