Décocher les trois premières cases vous ouvre les portes de la liberté !



Les classes CSS que vous pouvez trouver sans décocher les cases d'héritage :

Généralités sur le corps du blog
body {}

Liens (hover = survolés)
a {}
a:hover {}

Entête du blog : (H1 = titre)
#top  {}
#top h1 {}

Pied de page du blog :
#footer {}

Modules :
.box {}

Articles :
.article {}
.date {}
.titreArticle {}

Commentiares :
.commentMessage {}
.commentOption {}

Pages : (H2 = titre)
.page {}
.divPageTitle h2 {}

C'est peu...


Si vous décochez les deux premières cases (Feuille générale pour le template Feuille générale pour une variation) et  vous pourrez accéder aux variations suivantes (qui complètent les précédentes)

/* ////////////////////////////// */
/* Feuille générale pour une variation */
/* ------------------------------ */

Généralité du corps du blog
body {}
h1 {}
h2 {}
h3 {}
a {}
a:hover {}
legend {}
li {}
img {}
input {}

Ensemble du blog :
#global {}

Entête du blog :
#header{} 
#top  {}
#top h1 {}
#top .topLien {}
#top .topLien:hover {}

Pied de page :
#footer {}
#footer p {}

Règlementation over-blog :
#reglementBlog h1 {}

Configuration des articles :
.article {}
.article p {}
.contenuArticle {}
.date {}
.afterArticle {}
.afterArticle .options {}
.linkComment{}
.linkTrackback{}
.linkRecommend{}
.linkAddComment{}
.beforeArticle {}
.topic {}
.topic a {}
.topic a:hover { }
.titreArticle {}
.divTitreArticle {}
#articleSeul {}
.GcheTexte {}
.DrteTexte {}
.CtreTexte {}
.plusExtrait {}
.hitcitation {}
.hitencart {}
.hitimportant {}
.hitperso1 {}
.hitperso2 {}

Listes des articles (si le blog est configuré pour avoir les résumés à l'accueil) :
.listArticles {}
.resumeArticle {}

Affichage des commentaires :
.h2commentMessage {}
.comment {}
.comment hr {}
.afterReactions {}
.afterReactions .linkAddComment {}
.commentMessage {}
.commentOption {}
.reponseMessage {}

Formulaire de saisie d'un commentaire :
#formComment {}
#formComment h2 {}
#formComment label {}
#formComment input {}
#formComment textarea {}

Trackback :
#addTrackback {}
#addTrackback h2 {}
.showTrackback {}
.showTrackback a {}
.showTrackback a:hover {}
.showTrackback h2 {}
.afterReactions .linkAddTrackback {}
.h2Trackback {}
.nocomm

Fenêtre d'ajout d'un trackback :
#divTrackBack {}
#divTrackBack h2 {}
#divTrackBack input {}
#divTrackBack textarea {}

Fenêtre de recommandation
#divRecommander {}
#divRecommander span {}
#divRecommander h2 {}
#divRecommander input {}
#divRecommander textarea {}

Pagination du blog :
.pagination {margin:10px;}

Modules :
.box {}
.box-titre {}
.box-titre h2 {}
.box-content {}
.box-content p {}
.box-content ul {}
.box-content li {}
.box-footer {}
.basLien {}
.basLien:hover {}
.box-content .listAll {}
.box-content .listAll a {}

Module de présentation
#Presentation span {}
#Presentation .box-titre {}
#Presentation strong {}

Module du calendrier
#Calendrier .box-content {}
.calendarTop1 {}
.calendarToday1 {}
.calendarDays1 {}
.calendarHeader1 {}
.calendarTable1 {border:0px none;}

Module Newsletter
#divNewsletter h2 {}
#divNewsletter input {}
#divNewsletter .newsletter li {}
#divNewsletter {}
#Newsletter {}
#Newsletter form {}
#Newsletter {}
#Newsletter form {}

Module recherche
#Recherche {}
#Recherche form {}

Mise en page des pages
.page {}
.page p {}
.pageContent {}
.afterPage {}
.afterPage .options {}
.beforePage {}
.divPageTitle h2 {}
.divPageTitle {}

En décochant la troisième case (Feuille de structure générique) vous pourrez modifier la taille des colones et de la mise en page des éléments du blog :

/* ////////////////////////////// */
/* Feuille de structure générique */
/* ------------------------------ */

body, html {}
#global {}
.ln {}
.cl {}

#ln_1 {}
#cl_0_0 {}
#cl_1_0,#cl_1_2 {}
#cl_1_1 {}
#cl_2_0 {}

La dernière croix ne sert à rien... un mystère d'Over-blog !

La faille qui est exposé dans l’article précédent date de 2005 et est corrigée par les navigateurs. Si vous avez la dernière version, il y a peu de risque que vous soyez infecté ! J’ai comme senti un petit vent de panique…

On m'a souvent posé la question : mais c'est quoi le css ???
Et bien, le CSS est tout simplement un langage (Cascading Style Sheets). Pas comme le patois, mais un langage codé qui est utilisé pour définir l’aspect d’un site ou d’un blog. Il gère par exemple la couleur du fond de la page, les images, la couleur et le type de police de caractère. Dans chaque site, ou blog comme ici chez Over-Blog, le css est un petit fichier rempli de texte et de codes dans lequel se définissent les aspects visuels généraux.

L’avantage ?
En plus de pouvoir le modifier facilement, il offre aussi la possibilité de généraliser l'aspect d'un site ou d'un blog. En effet, il n’est plus nécessaire de définir dans chaque page le style qui désiré. C’est donc plus rapide et moins lourd à charger. Ca évite les petites erreurs de styles qu’on aurait pu laisser passer.

Comment l’utiliser ?

Le fichier CSS (par exemple nommé style.css) est un fichier indépendant placé à la racine du site web. Il est ensuite indiqué dans chaque pages web par l’utilisation d’un petit code comme ci-dessous :

<head><link rel="stylesheet" type="text/css" href="style.css" /></head>

Dans le cas d’un blog il n’est pas nécessaire de l’héberger, c’est pris en compte par la plateforme. 


Comment le trouver dans Over-Blog ?
Pour Over-Blog, cette feuille de style est accessible en allant dans l’administration puis dans "design", puis dans "mode avancé".