Canalblog
Editer l'article Suivre ce blog Administration + Créer mon blog
Publicité
Les tuto 2 Demolite
1 décembre 2010

Mettre une image de fond sous votre calendrier

Ouvrez votre feuille de style, descendez sur le bloc #calendar puis ajoutez la ligne suivante dans le bloc :

background-image: url("Adresse de votre image");

Comme ceci :

#calendar {
    font-family: Georgia;
    color: #000000;
    font-size: small;
    line-height: 150%;
    padding: 0px;
    margin-bottom: 0px;
    background-image: url("http://Adresse de votre image.gif");
}

Collez l'adresse de votre image dans la ligne de code et validez.

Vous devez choisir une image de la même taille que l'affichage de votre calendrier (180X180) à peu près, car si l'image est trop petite, elle va se répéter et si elle est trop grande, elle sera coupée.
ça marche aussi avec une image animée...

Un bel exemple ici !

Une fois que vous aurez mis votre image de fond, il y a de grande chance pour que vos chiffres soient moins visibles, forcement en fonction de la couleur de votre image, ça peut faire un ton sur ton...

Pas de panique, retournez dans votre feuille de style et descendez sur les blocs de votre calendrier :

#calendar {
    font-family: Georgia;
    color: #FFFFFF;
    font-size: small;
    line-height: 150%;
    padding: 0px;
    margin-bottom: 0px;
    background-image: url("https://storage.canalblog.com/66/66/255038/17491685.gif");
}
#calendar table {
    width: 100%;
    padding: 2px;
    border-collapse: collapse;
    border: 0px;
}
#calendar caption {
    font-family: Georgia;
    color: #FFFFFF;
    font-size: small;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    padding: 3px;
}
#calendar th {
    font-weight: normal;
    text-align: center;
}
#calendar td {
    text-align: center;
}

Pour changer la couleur des chiffres et du titre, modifier les codes couleurs #FFFFFF
Si votre fond est noir, choisissez les chiffres blancs par exemple...

#calendar : pour les chiffres

#calendar caption : pour le titre (le mois du calendrier)

Publicité
Publicité
Commentaires
L
Bonjour^^<br /> Comment ca va?<br /> Moi ca y est, je suis passée en mode avancé et grace à tes tutos, j'avance doucement dans quelque chose qui me représente bien mieux.<br /> J'admets que j'ai pas facile et que je dois souvent recommencer, mais quel plaisir d'y arriver après^^.<br /> Bref, juste pour te dire que j'avance pas mal et que j'ai trouvé le moyen de changer la police de l'horloge (en réfléchissant bien^^ lol) sans suivre de tuto mais c'était facile à trouver.<br /> Sur ce je te laisse j'ai encore beaucoup de chose à accomplir et je suis dans ma lancée^^<br /> Bonne journée et à bientôt si j'ai besoin d'aide.<br /> PS: puis je mettre un lien vers ton blog? (te rajouter dans mes blogs amis?)
Publicité
Derniers commentaires
Newsletter
Publicité