High-Tech Santé Médecine Droit-Finances

Réalisation

vidéo numérique

Rechercher : dans
Par :

Propriétés de la page : centrer une image

Dernière réponse le 13 mar 2008 à 09:53:23 frenchcookies, le 17 jun 2007 à 15:20:14 
 Signaler ce message aux modérateurs

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.

Configuration: Windows XP
Internet Explorer 6.0

Meilleures réponses pour « propriétés de la page : centrer une image » dans :
[Webmaster] Empêcher la copie de mes images (et autres) VoirA tous ceux qui veulent empêcher la copie de leurs images, leurs créations, leurs vidéos, leurs articles, etc... Je veux empêcher les autres de copier mes images et mes pages HTML. Comment faire ? Réponse: C'EST IMPOSSIBLE Il n'existe aucun...
Diminuer la taille d'une image VoirSi vous trouvez que vos photos sont trop grosses ou trop lourdes (par exemple pour envoyer par mail ou pour publier sur une page web), voici 4 étapes pour diminuer la taille des fichiers: Étape 1 (optionnel !) : Passer GREYCStoration sur...
[Word] Image de fond VoirIl est possible sous Microsoft Word d'afficher une image en arrière-plan dans un document en cliquant sur le menu Format, puis sur Arrière-Plan et enfin sur Motifs et textures. Dans l'onglet Image, cliquer sur le bouton "Sélectionner une image"....
Télécharger Zotero VoirZotero est un puissant moteur de recherche de collecte de données sur le web (citations, texte complet, pages web, images et autres). Par la suite vous pouvez partager les données de différentes manières. Une extension du navigateur Firefox, Zotero...
Gestion des images en HTML VoirComment afficher des images sur une page web? Quelques images sur un site Web peuvent le rendre plus attractif et plus convivial, cependant il est important de ne pas sombrer dans l'excès car les images peuvent impliquer un temps de chargement...
Posez votre question Répondre

1

Scriptiz, le 17 jun 2007 à 15:33:23

Tu veut la centrer en arrière-plan où en contenu?

   
Répondre à Scriptiz

17

macha nette, le 15 aoû 2007 à 07:39:24

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

   
Répondre à macha nette

2

frenchcookies, le 17 jun 2007 à 15:39:24

En arrière plan.

   
Répondre à frenchcookies

3

Scriptiz, le 17 jun 2007 à 15:43:40

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>

   
Répondre à Scriptiz

4

Scriptiz, le 17 jun 2007 à 15:44:37

<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>

   
Répondre à Scriptiz

5

frenchcookies, le 17 jun 2007 à 15:53:35

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.

   
Répondre à frenchcookies

6

Scriptiz, le 17 jun 2007 à 15:58:43

Si tu as une feuille de style déjà liée à ta page ne copie que ceci dans ta page de style : 

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 ;)

   
Répondre à Scriptiz

7

frenchcookies, le 17 jun 2007 à 16:10:05

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 !

   
Répondre à frenchcookies

8

frenchcookies, le 17 jun 2007 à 16:47:51

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.

   
Répondre à frenchcookies

9

Dalida, le 17 jun 2007 à 17:40:36

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. 

body{
background-position:center;
}

[ Mathieu ] 
Il y a surement des pandas pour ne dépendre de rien

   
Répondre à Dalida

10

Scriptiz, le 17 jun 2007 à 17:44:38

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://mammouthland.free.fr/cours/css/cours9.php

   
Répondre à Scriptiz

16

macha nette, le 15 aoû 2007 à 06:40:58

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 ?

   
Répondre à macha nette

11

frenchcookies, le 17 jun 2007 à 17:57:59

Ok, j'ai du boulot avant de maîtriser !

masi dans Dreamweaver, où on codifie ?

   
Répondre à frenchcookies

12

Scriptiz, le 17 jun 2007 à 18:16:47

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 ;)

   
Répondre à Scriptiz

13

frenchcookies, le 17 jun 2007 à 18:33:06

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

   
Répondre à frenchcookies

14

Scriptiz, le 17 jun 2007 à 19:09:46

Envoie moi tout ton site zippé à scriptiz[at]uo-hyel[dot]com

remplace [at] par @
et [dot] par un .

Je te ferai ça ;)

   
Répondre à Scriptiz

15

Dalida, le 17 jun 2007 à 19:42:01

>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> : 

<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'.
[ Mathieu ] 
Il y a surement des pandas pour ne dépendre de rien

   
Répondre à Dalida

18

uhhjk, le 28 nov 2007 à 19:52:29

Slt mon image darriére plan saffiche mais pas les document

   
Répondre à uhhjk

19

nrks27, le 13 mar 2008 à 09:20:54

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

   
Répondre à nrks27

20

Dalida, le 13 mar 2008 à 09:42:44

Salut,

qu'est-ce que tu racontes ?
[ Mathieu ] 

Pensez à utiliser le bouton "Conserver la mise en forme du texte sélectionné" pour mettre en forme les codes sources et à cocher l'option "Résolu" quand c'est le cas, merci !

   
Répondre à Dalida

21

nrks27, le 13 mar 2008 à 09:44:02
  • +1

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.

   
Répondre à nrks27

22

nrks27, le 13 mar 2008 à 09:48:04

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 ;)
NrKS.

   
Répondre à nrks27
23 réponses 12 Suivant
Posez votre question Répondre
Ils ont besoin de votre aide
Collection CommentÇaMarche.net