Propriétés de la page : centrer une image
Résolu
frenchcookies
Messages postés
20
Date d'inscription
Statut
Membre
Dernière intervention
-
Dalida Messages postés 6728 Date d'inscription Statut Contributeur Dernière intervention -
Dalida Messages postés 6728 Date d'inscription Statut Contributeur Dernière intervention -
bonjour,
j'aimerais centrer une image (logo) sur une page :
http://theranchhands.free.fr/pages/groupeintro.htm
j'utilise dreamweaver 4.
pour l'instant je l'ai mise en image d'arrière plan, elle est donc dupliquée.
mais je voudrais avoir une seule fois l'image, centrée en largeur et hauteur. si ce n'est pas possible (on n'a pas tous la même taille écran), j'aimerais au moins pouvoir la centrer horizontallement. Or quand je la mets dans "tracé de l'image" elle est calée à gauche.
merci d'avance.
j'aimerais centrer une image (logo) sur une page :
http://theranchhands.free.fr/pages/groupeintro.htm
j'utilise dreamweaver 4.
pour l'instant je l'ai mise en image d'arrière plan, elle est donc dupliquée.
mais je voudrais avoir une seule fois l'image, centrée en largeur et hauteur. si ce n'est pas possible (on n'a pas tous la même taille écran), j'aimerais au moins pouvoir la centrer horizontallement. Or quand je la mets dans "tracé de l'image" elle est calée à gauche.
merci d'avance.
A voir également:
- Propriétés de la page : centrer une image
- Impossible de supprimer une page word - Guide
- Numéro de page word - Guide
- Imprimer tableau excel sur une page - Guide
- Page d'accueil - Guide
- La page ne peut être affichée. (80710a06) - Forum PS3
20 réponses
Je veux centrer l'image et le contenu dedans
( je sais que je t'ai écris tantot mais j'ai refais des tests)
J'ai centré ma page pour le web et le contenu dedans bouge gggrrrrr
l'image se centre mais pas le contenu.
Alors quand ma fenetre sur le web est petite ca focntionne tout a l'air beau j'aggrandi ma page web et l'arriere plan est centré mais le contenu reste plutot a droite, le contenu ne suis pas l'image d"arriere plan ?!?
Je ne sais aps si c'est plus clair mais peux-tu m'aider ?
Macha
( je sais que je t'ai écris tantot mais j'ai refais des tests)
J'ai centré ma page pour le web et le contenu dedans bouge gggrrrrr
l'image se centre mais pas le contenu.
Alors quand ma fenetre sur le web est petite ca focntionne tout a l'air beau j'aggrandi ma page web et l'arriere plan est centré mais le contenu reste plutot a droite, le contenu ne suis pas l'image d"arriere plan ?!?
Je ne sais aps si c'est plus clair mais peux-tu m'aider ?
Macha
Utilise le css alors ;)
<html> <head> <style type="text/css"> body { background-image: url('tonimage.jpg'); background-repeat: no-repeat; background-position:center center; } </style> </head> <body> </body> </html>
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
<html>
<head>
<style type="text/css">
body
{
background-image: url('tonimage.jpg');
background-repeat: no-repeat;
background-position:center center;
}
</style>
</head>
<body>
</body>
</html>
<head>
<style type="text/css">
body
{
background-image: url('tonimage.jpg');
background-repeat: no-repeat;
background-position:center center;
}
</style>
</head>
<body>
</body>
</html>
Heuhhhhh je n'y arrive pas. comme je n'y connais rien j'ai tout copié et collé. ca me donne une page grise...
1- faut il que je colle tout ?
2- le chemin vers l'image est il bon ?
3- tu parles de CSS : j'ai effectivement une feuille de style, mais je ne m'en sers que pour mettre en forme les titres.
1- faut il que je colle tout ?
2- le chemin vers l'image est il bon ?
3- tu parles de CSS : j'ai effectivement une feuille de style, mais je ne m'en sers que pour mettre en forme les titres.
si tu as une feuille de style déjà liée à ta page ne copie que ceci dans ta page de style :
Et vérifie qu'il n'y a pas déjà un conteneur body, si il y en a déjà un copy ceci dedans :
ps: l'url de l'image c'est toi qui doit l'entrer en fonction de ton image ;)
body { background-image: url('tonimage.jpg'); background-repeat: no-repeat; background-position:center center; }
Et vérifie qu'il n'y a pas déjà un conteneur body, si il y en a déjà un copy ceci dedans :
background-image: url('tonimage.jpg'); background-repeat: no-repeat; background-position:center center;
ps: l'url de l'image c'est toi qui doit l'entrer en fonction de ton image ;)
je n'ai jamais fait ça. alors quand je vais dans modifier feuille de style, j'ai le choix :
- lien
- modifier
- nouveau
si je choisis modifier feuille, j'ai :
- lien
- nouveau
puis si j'ai choisit nouveau :
- sélecteur : a:.....
- type (utiliser le sélecteur CSS)
où dois je aller pour coller le bout programme ????
merci pour ton aide !
- lien
- modifier
- nouveau
si je choisis modifier feuille, j'ai :
- lien
- nouveau
puis si j'ai choisit nouveau :
- sélecteur : a:.....
- type (utiliser le sélecteur CSS)
où dois je aller pour coller le bout programme ????
merci pour ton aide !
faute d'avoir la réponse, j'ai feinté : j'ai inséré une image sur la page.
mais je reste intéressée de savoir où aller dans les CSS pour coller le prog proposé ci-dessus.
mais je reste intéressée de savoir où aller dans les CSS pour coller le prog proposé ci-dessus.
2 center la centre aussi horizontalement :P
ou alors tu peut mettre :
background-position: 50% 50%;
Le premier 50% représente la position horizontale de la page, le deuxième sa position verticale.
par exemple, background-position: 100% 0%; te mettra ton image de fond en haut a droite de ta page.
background-position: 0% 100%; te mettra ton image de fond en bas à droite
cette page est très bien faite : http://css.mammouthland.net/image_de_fond.php
ou alors tu peut mettre :
background-position: 50% 50%;
Le premier 50% représente la position horizontale de la page, le deuxième sa position verticale.
par exemple, background-position: 100% 0%; te mettra ton image de fond en haut a droite de ta page.
background-position: 0% 100%; te mettra ton image de fond en bas à droite
cette page est très bien faite : http://css.mammouthland.net/image_de_fond.php
Suite a cette discution fort interessante j'ai fais center center 2 fois l'image est parfaitement centrée
Mais le problème qui ce pose c'est que je ne peux plus me fier au marge pour ajuster mon écriture .
J'ai une image arrirere plan et mon text sur dreamveawr tout est beau et quand je transfert sur le web burkk tout est décentré je parle de mon text.... comment faire pour me fier au marge quand on y ajoute center center ?
Mais le problème qui ce pose c'est que je ne peux plus me fier au marge pour ajuster mon écriture .
J'ai une image arrirere plan et mon text sur dreamveawr tout est beau et quand je transfert sur le web burkk tout est décentré je parle de mon text.... comment faire pour me fier au marge quand on y ajoute center center ?
Dans dreamweaver, tu clique sur le bouton nouvelle règle CSS, ensuite tu choisi une règle de balise, et tu choisi la balise body. Puis dans Arrière-plan tu as tout ce qu'il te faut ;)
merci Scriptiz, j'ai trouvé. mais je ne peux pas y mettre le code. j'ai essayé de bidouiller, mon image ne veut pas se centrer malgré ce que je demande. et la cata c'est que l'image mise en arrière plan apparait sur toutes mes pages !
je crois que je vais en rester à mon image collée dans un calque :
http://theranchhands.free.fr/pages/groupeintro.htm
c'est ce que je voulais, mais je n'ai peut être pas utilisé la méthode optimale.
merci à tous
je crois que je vais en rester à mon image collée dans un calque :
http://theranchhands.free.fr/pages/groupeintro.htm
c'est ce que je voulais, mais je n'ai peut être pas utilisé la méthode optimale.
merci à tous
envoie moi tout ton site zippé à scriptiz[at]uo-hyel[dot]com
remplace [at] par @
et [dot] par un .
Je te ferai ça ;)
remplace [at] par @
et [dot] par un .
Je te ferai ça ;)
>Scriptiz
c'est dommage de ne pas laisser les gens apprendre par eux même.
dommage encore que je n'ai pas le temps de coder une démo parce que je ne suis pas d'accord avec ce que tu avances au sujet du positionnement de l'arrière plan et rien ne vaut un bon exemple.
>frenchcookies
si tu veux que l'arrière plan ne s'applique qu'à une page.
dans la page tu appliques une classe à la balise <body> :
et la css tu la modifie pour que la règle ne s'applique qu'à ce <body> là :
n'oublie pas le point '.' avant 'arriereplan'.
c'est dommage de ne pas laisser les gens apprendre par eux même.
dommage encore que je n'ai pas le temps de coder une démo parce que je ne suis pas d'accord avec ce que tu avances au sujet du positionnement de l'arrière plan et rien ne vaut un bon exemple.
>frenchcookies
si tu veux que l'arrière plan ne s'applique qu'à une page.
dans la page tu appliques une classe à la balise <body> :
<body class="arriereplan">
et la css tu la modifie pour que la règle ne s'applique qu'à ce <body> là :
.arriereplan { background-image: url('tonimage.jpg'); background-repeat: no-repeat; background-position: center; }
n'oublie pas le point '.' avant 'arriereplan'.
c'est vraiment nébuleux tout ça !!..ou plutôt nimporte quoi..n'importe qui aurait pu trouver qu'il fallai mettre
background="*.Jpg" ou align "center"
le truc, c'est ou !? osef si c'est des feuilles de css..et des commandes qui sortent de nul part^^ si on sait correctement comment faire!
Une explication plus précise?!
Tkx
background="*.Jpg" ou align "center"
le truc, c'est ou !? osef si c'est des feuilles de css..et des commandes qui sortent de nul part^^ si on sait correctement comment faire!
Une explication plus précise?!
Tkx
Donc recommençons tout depuis 0 .. !
Voila : dans sa page de code html il faut rajouter la ligne suivante juste après le </head>
<body bgcolor="#F5F5F5" background="images/AP.jpg">
--> le image/AP.jpg est le dossiers et le fichiers de l'images..
ensuite il faut crée une feuilles css..comment faire? avec le bloc note!!
et on y rajoute les ligne suivante ! :
body{
background-position:center;
}
tout simplement! ensuite on sauvegarde et on modifie l'extension de .txt en .css (n'oublier pas de modifier les options de windows pour voir les extensions..-_- ->Outils / Options des dossiers / Affichages..)
ce n'est pas fini!!
il faut ensuite joindre la feuilles css qui se trouve dans le même dossier que sa page html
comment faire? rajouter la ligne suivante juste apres le <head><link rel="stylesheet" type="text/css" href="BackGround.css">
et voilaaa!! une explication enfin précises et qui fonctionne ;)
NrKs.
Voila : dans sa page de code html il faut rajouter la ligne suivante juste après le </head>
<body bgcolor="#F5F5F5" background="images/AP.jpg">
--> le image/AP.jpg est le dossiers et le fichiers de l'images..
ensuite il faut crée une feuilles css..comment faire? avec le bloc note!!
et on y rajoute les ligne suivante ! :
body{
background-position:center;
}
tout simplement! ensuite on sauvegarde et on modifie l'extension de .txt en .css (n'oublier pas de modifier les options de windows pour voir les extensions..-_- ->Outils / Options des dossiers / Affichages..)
ce n'est pas fini!!
il faut ensuite joindre la feuilles css qui se trouve dans le même dossier que sa page html
comment faire? rajouter la ligne suivante juste apres le <head><link rel="stylesheet" type="text/css" href="BackGround.css">
et voilaaa!! une explication enfin précises et qui fonctionne ;)
NrKs.
oups trop rapide pour écrire le message..et j'était pas identifié -_-
comment faire? rajouter la ligne suivante juste apres le <head>
<link rel="stylesheet" type="text/css" href="BackGround.css">
sans oublier de remplacer le BackGound.css par le nom que vous avez attribué au fichier^^
et voilaaa!! une explication enfin précises et qui fonctionne ;)
comment faire? rajouter la ligne suivante juste apres le <head>
<link rel="stylesheet" type="text/css" href="BackGround.css">
sans oublier de remplacer le BackGound.css par le nom que vous avez attribué au fichier^^
et voilaaa!! une explication enfin précises et qui fonctionne ;)
oui, mais elle est bâtarde ta solution.
tu utilises à la fois des attributs HTML et des règles CSS et tu trouves ça brillant ?!
comprends ce que tu fais avant de donner de si bons conseils.
tu utilises à la fois des attributs HTML et des règles CSS et tu trouves ça brillant ?!
comprends ce que tu fais avant de donner de si bons conseils.
salut,
ce n'est pas un 'prog' mais un code !
pour débuter en css :
ccm
mammouthland
si elle est purement décorative, il faut mettre l'image en arrière plan.
pour la propriété {background-position} un seul 'center' suffit.
ce n'est pas un 'prog' mais un code !
pour débuter en css :
ccm
mammouthland
si elle est purement décorative, il faut mettre l'image en arrière plan.
pour la propriété {background-position} un seul 'center' suffit.
body{ background-position:center; }