Mise en place d'une image en fond de page
Avant propos:
Ce tutoriel a pour but d'agrémenter la présentation d'une page Web d'un fond de plan avec une image ce qui ne manquera pas d'apporter une touche originale à votre page.
Le but de ce tutoriel est de mettre en place une image fixe en fond de page, en utilisant le code :
{Background-image:url("l'adresse de votre image"}
Voir l'exemple ci-dessous
PAS DE DOUTE !!
si vous aimez le Karting, les Challenges, la Compétition, vous êtes bien sur le BON SITE. Ce dernier vous propose de vous informer et de relater les différentes manifestations qui se déroulent
sur le Circuit tout au long de l'année, avec comme point d'orgue la "Coupe de l'Amitié" dont la 3eme édition est programmée les 28 & 29 août 2010. En vous souhaitant bonne navigation, et en
espérant vous compter bientôt parmi nos nombreux "Amis". Michel BLANC Directeur du Circuit ELCEKA, et toute son Equipe.
www.elceka-1max2karting.com
Difficulté
Ce tutoriel est facile, mais nécéssite un minimum de préparation concernant l'image utilisée:
- cette dernière doit avoir un fond clair pour permettre une bonne vision du texte.
Pour ce faire, utiliser un logiciel permettant les retouches d'images tel que :
FhotoFiltre
http://www.photofiltre.com
Avec se dernier vous pourrez modifier votre image(+de luminosité pour éclaircir,) redimenssioner votre image "outils" "
automatisation" (ici : 520x380pix variable suivant votre Design) et la compresser à l'enregistrement. Il est souhaitable que votre photo soit la plus légère possible pour permettre un
affichage rapide.
Pas à pas :
1) Placer le code ci-dessous dans le HEAD
</TITLE>
<style type="text/css">
body
{
background-image: url("adresse de votre image")
background-color: #FFFFFF ;
}
.boite
{
background-image: url("adresse de votre image") ;
width: 520px ;
height: 380px ;
background-color:#FFFFFF ;
}
</style>
<BODY BGCOLOR="#FFFFFF" >
2) Ajouter un module "widget/Html sur la page Jimdo de votre choix.
3) Placer le code ci-dessous dans le module
<p align="center" class="boite">votre texte ICI</p>
4) Enregistrer et voilà.
Vous avez une question ?
retour Accueil
Version imprimable
Recommander ce site