Mettre un fond image sous votre titre
Partie "Haut"
| Nom de l'attribut | Nom CSS | Valeur | Valeurs possibles |
| Couleur de fond | background | Choisir | |
| Image de fond | background-image | Adresse d'une image (clic droit>propriétés sur une image) | |
| Répetition de l'image de fond | background-repeat | Dépend de l'image de fond | |
| Hauteur | height | Dimension en pixels (ex : 200px) | |
| Marge intérieure haute | padding-top | Dimension (ex: 10px) | |
| Taille de la bordure | border-width | Dimension (ex:2px) | |
| Style de la bordure | border-style | ||
| Couleur de la bordure | border-color | Choisir |
CSS de cette règle :
#haut
{
background : #EBEDAB; /* couleur du fond modifiée */
background-image : url(http://diztest.blog4ever.com/blog/url_artimage-205392--.html);
background-repeat : repeat;
height : 80px; /* hauteur agrandie pour contenir le titre */
padding-top : 5px;
border-width : 4px; /* taille bordure augmentée */
border-style : double; /* style bordure modifié */
border-color : #00FF00; /* couleur bordure modifiée */
text-align : center;
background-attachment : fixed;
}
Partie "Haut > Titre"
| Nom de l'attribut | Nom CSS | Valeur | Valeurs possibles |
| Couleur du texte | color | Choisir | |
| Décoration du texte | text-decoration | ||
| Taille de la police | font-size | ex: 10pt | |
| Famille de la police | font-family | ex: Arial, Verdana, Trebuchet MS |
CSS de cette régle :
#haut h1 a
{
color : #00CC00; /* attribut ajouté */
text-decoration : none;
font-size : 40pt; /* taille des caractères augmentée */
font-family : Comic sans Ms;
}
J'ai utilisé une image classique de fond, dans Blog4ever il y a des artistes en peinture ou photo, je suis certain qu'il y aura de belles compositions, indiquez-moi votre blog en commentaire ainsi vous servirez d'exemples pour les blog4everistes.
Astuces
Sur chaque page de votre blog vous pouvez mettre une image différentes, pour les spécialistes photos, un panoramique en rapport avec le sujet traité dans la page.
Pour réaliser cette opération il faut, comme moi sur cette page, dans chaque page rentrer dans le composeur en mode HTML, le code suivant avec l'adresse de votre image :
Uniquement l'attribut de l'image
<STYLE type=text/css>
#haut { background-image : url(http:// adresse de votre image); }
</style>
#haut { background-image : url(http:// adresse de votre image); }
</style>
ou les 2 règles comme ci-dessous, si vous souhaiter changer d'autres attributs.
<STYLE type=text/css>
#haut
{
background : #EBEDAB;
background-image : url(http:// adresse de votre image);
background-repeat : repeat;
height : 80px;
#haut
{
background : #EBEDAB;
background-image : url(http:// adresse de votre image);
background-repeat : repeat;
height : 80px;
padding-top : 5px;
border-width : 4px;
border-style : double;
border-color : #00FF00;
text-align : center;
background-attachment : fixed;
}
#haut h1 a
{
color : #00CC00;
text-decoration : none;
font-size : 40pt;
font-family : Comic sans Ms;
}
</STYLE>
border-width : 4px;
border-style : double;
border-color : #00FF00;
text-align : center;
background-attachment : fixed;
}
#haut h1 a
{
color : #00CC00;
text-decoration : none;
font-size : 40pt;
font-family : Comic sans Ms;
}
</STYLE>
Commentaires
leptimondedesofiane site : leptimondedesofiane.blog4ever.com | le 21/05/2008 à 23:58:55Bonjour Papyclic
Très bonne idée ce blog et encore merci pour ton aide.
J'ai utilisée ton astuce pour le "haut" et "cadre" et j'ai maintenant quelques pages avec des fonds différents, c'est très joli.
Bonne continuation, à bientôt
Nathalie
Nanodu36 site : http://nanodu36.blog4ever.com | le 19/05/2009 à 11:57:18
Bonjour Papylic,
C'est une journée,ou j'ai la chance de pouvoir lire vos explications,afin d'ameliorer les sites,encore Bravo.
J'aurais voulu savoir comment mettre une image de fond derriere ma Banniere "Celle que je souhaite se trouve" sur ma page d'Acceuil.
Merci d bien vouloir me renseigner.
Ce site est un lien d'Amitié des deux rives de la Méditérrannée.
Bonne journée.
Nanodu36
PapyClic le 19/05/2009 à 17:00:16
Bonjour Nano36
Ta question m'a permis de faire une petite rectification, sur le haut de cette page. J'ai mis une bannière que l'on m'a offerte, elle ne cadrait pas bien avec ma partie "Haut".
Pour toi il faut que tu mets l'image dans la partie "Haut" du Diz Perso. La bannière restera dans tout le blog c'est celle que tu as mis dans ta gestion VOTRE BLOG Titre/logo, très bien. Comme elle ne remplit pas tout le haut tu peux mettre une autre image en-dessous sans problème.
Bonne continuation
bewaars le 14/11/2009 à 02:33:11
voila g un probleme g ma baniere ki aparai 2 foi sur ma pager daceuille une foi a la place normale et une otre foi bien + ba comence faire pour kel aparai ke une foi merci
PapyClic le 14/11/2009 à 08:12:14
Bonjour Bewaars
Difficile de te répondre sans avoir l'adressse de ton blog. Mais je pense que tu as certainement mis ta bannière dans ta gestion VOTRE BLOG --> Titre/logo et également dans le CSS comme background-image dans le CSS. Si tu n'y arrives pas, ouvres un sujet dans le forum BLOG4EVER.
Bonne continuation