Les tuto 2 Demolite

Blog tuto, aide à la création et au design des blogs et sites internet, Montage photo, trucs et astuces, logiciels gratuits...

29 novembre 2010

Mettre une bannière sur son blog en mode avancé

Posté par Demolite - Dans la catégorie Canalblog
Tags : , ,

Commencez par redimensionner une image, votre bannière doit être de la même largeur que #Container

800px ou 900px  ou encore 1000px ça dépend des modèles...

Ouvrez votre Feuille de style :

Apparence/Editer les fichiers de ce modèle/feuille de style générale

Notez que Container fait 900px (dans cet exemple)

Sans_titre_2

Donc, si votre Container fait 900px, votre image doit faire 900px...par la hauteur que vous voulez.

Ensuite ouvrez un Nouveau message

Puis Insertion d'un fichier !

Sans_titre_1

(Ne passez pas par : Insertion d'une image !!!! sinon les dimensions de votre bannière ne seront pas respectées.)

Passez en Mode Html en cliquant sur l'icône :

Sans_titre_5

Copier l'adresse de l'image

http://p8.storage.canalblog.com/88/13/251752/24825322.gif

Ensuite allez dans la Feuille de style générale

Repérez le bloc #topbar-logo et rajouter la ligne ci-dessous dans le bloc, en collant L'adresse de votre image.

background: url("http://Adresse de votre image.jpg") no-repeat 0% 0%;

Comme ceci :

#topbar-logo {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-width: 1px;
    border-color: #;
    background: url("http://Adresse de votre image.jpg") no-repeat 0% 0%;
    height: 300px;
    display: block;
}

Dans cet exemple, la bannière fait 900x300, il faut donc que le "height" soit à 300px sinon votre bannière ne s'affichera pas !

Ajoutez aussi la ligne display: block; si elle n'y est pas.

Votre bloc doit maintenant être comme celui là :

http://p7.storage.canalblog.com/70/14/251752/24825344.gif


Rappel : Avant de modifier vos pages html, faites une copie ! <---Tuto ici


« Accueil 1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41