Centrer les pages avec Dreamweaver 2
Résolu/Fermé
Phil
-
13 janv. 2010 à 18:42
notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 - 17 janv. 2010 à 16:54
notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 - 17 janv. 2010 à 16:54
A voir également:
- Centrer les pages avec Dreamweaver 2
- Word numéro de page 1/2 - Guide
- Supprimer des pages sur word - Guide
- Whatsapp avec 2 cartes sim - Guide
- 2 ecran pc - Guide
- Comment restaurer les pages google - Guide
2 réponses
notobe
Messages postés
1952
Date d'inscription
mercredi 11 novembre 2009
Statut
Membre
Dernière intervention
8 juillet 2011
213
13 janv. 2010 à 21:24
13 janv. 2010 à 21:24
Déjà, si vous voulez avoir une chance d'avoir un site qui passe sur tous les navigateurs : mettez dreamweaver 2 à la corbeille !
Passez à Kompozer, ce sera moins pire ;)
Pour center des pages en CSS, ce n'est pas compliqué :
Il faut mettre text-align:center au body. Vous pouvez même rajouter un margin:auto pour être sûr.
Cela dit, attention, ça va vraiment tout centrer, texte et images. C'est bien ce que vous voulez ?
Passez à Kompozer, ce sera moins pire ;)
Pour center des pages en CSS, ce n'est pas compliqué :
Il faut mettre text-align:center au body. Vous pouvez même rajouter un margin:auto pour être sûr.
body {
text-align:center;
margin:auto;
}
Cela dit, attention, ça va vraiment tout centrer, texte et images. C'est bien ce que vous voulez ?
graffx
Messages postés
6506
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
24 mars 2019
1 974
13 janv. 2010 à 21:34
13 janv. 2010 à 21:34
body est pour toute la page, je ne conseil pas un center la dessus, je pense qu' il parlait plutot d' un tableau.
Bon ben quitte a faire un code sale =)
pour aligner ton tableauau centre :
<table align="center">
<tr>
<td>
</td>
</tr>
</table>
sinon centrer juste un texte ou image, dreamwaver arrive a créer la partie css a peu prés, donc selectionne ton texte puis en bas de page, propriétés, tu a l' alignement gauche, milieu, droite et je sais plus.
Bon ben quitte a faire un code sale =)
pour aligner ton tableauau centre :
<table align="center">
<tr>
<td>
</td>
</tr>
</table>
sinon centrer juste un texte ou image, dreamwaver arrive a créer la partie css a peu prés, donc selectionne ton texte puis en bas de page, propriétés, tu a l' alignement gauche, milieu, droite et je sais plus.
14 janv. 2010 à 11:47
Merci pour cette réponse, c'est vrai je pense que Dreamweaver 2 est dépassé mais j'en connais les principes et je ne veux pas me prendre trop la tête. J'essaierai quand même d'utiliser ce que vous préconisez, c'est peut pas si compliqué que je l'imagine.
Pour mon souci de centrage, je veux que l'ensemble de la page soit centré quelque soit le type d'affichage et d'écran donc.
Je vous mets à la suite, ma page d'accueil HTML. Dites moi, si vous le voulez bien où il faut que je mette le code que vous m'indiquez.
Merci d'avance de votre aide.
Phil.
<html>
<head>
<title>Page d'accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
a:active { left: auto; clip: rect( auto )}
-->
</style></head>
<body bgcolor="#FFFFFF" background="Fond%20de%20la%20page%20d'accueil.jpg">
<b></b> <b></b> <b></b> <b></b> <b></b>
<div id="Layer3" style="position:absolute; width:127px; height:75px; z-index:3; left: 1092px; top: 24px"><a href="pagedaccueilang.htm"><img src="Royaume%20uni.gif" width="135" height="72" border="0"></a></div>
<div id="Layer2" style="position:absolute; width:127px; height:21px; z-index:4; left: 1092px; top: 100px; background-color: #CCFFCC; layer-background-color: #CCFFCC; border: 1px none #000000">
<div align="center"><font face="Calibri"><b><font color="#008040">English version</font>
</b></font></div>
</div>
<div id="Layer4" style="position:absolute; width:121px; height:115px; z-index:5; left: 142px; top: 237px"><img src="Trigonella%20capitata%20fleurs%202004%20Yozgat.jpg" width="233" height="166"></div>
<div id="Layer5" style="position:absolute; width:202px; height:143px; z-index:6; left: 381px; top: 238px"><img src="Astragalus%20asterias%20Stev.%20ex%20Ledeb.%20subsp.%20asterias%202005%20Ankara.jpg" width="233" height="166"></div>
<div id="Layer6" style="position:absolute; width:200px; height:115px; z-index:7; left: 143px; top: 411px"><img src="Vicia%20seriocarpa%20Fenzl%20var.%20seriocarpa%202005%20Adiyaman.jpg" width="233" height="166"></div>
<div id="Layer7" style="position:absolute; width:200px; height:115px; z-index:8; left: 382px; top: 411px"><img src="Trifolium%20pauciflorum%20d'Urv.%202005%20Kilis.jpg" width="233" height="166"></div>
<div id="Layer8" style="position:absolute; width:470px; height:338px; z-index:9; left: 621px; top: 238px"><b><font color="#008040" face="Calibri" size="+7"><img src="Nemrut%20Dagi.jpg" width="470" height="339"></font></b></div>
<div id="Layer9" style="position:absolute; width:334px; height:170px; z-index:10; left: 687px; top: 259px">
<div align="center"><font face="Calibri" size="+1"><b><font color="#CC230B">Dans
ce site, nous vous proposons d'accéder aux images numérisées des parts d'herbier
récoltées lors de nos nombreux voyages en Turquie, et en particulier dans
le Sud et l'Est du pays, en espérant qu'elles puissent vous aider dans vos
propres déterminations.</font></b></font></div>
</div>
<div id="Layer10" style="position:absolute; width:77px; height:41px; z-index:11; left: 717px; top: 495px"><img src="email.gif" width="81" height="45"></div>
<div id="Layer11" style="position:absolute; width:213px; height:26px; z-index:12; left: 808px; top: 515px">
<div align="center"><b><i><font face="Calibri" color="#D90000" size="+1"><a href="mailto:flora.of.turkey@orange.fr">flora.of.turkey@orange.fr</a></font></i></b></div>
</div>
<div id="Layer12" style="position:absolute; width:336px; height:30px; z-index:13; left: 686px; top: 438px">
<div align="center"><font face="Calibri"><b><font size="+1" color="#D70000">Pierre
COULOT & Philippe RABAUTE</font></b></font></div>
</div>
<div id="Layer14" style="position:absolute; width:949px; height:53px; z-index:15; left: 143px; top: 612px; background-color: #CCFFCC; layer-background-color: #CCFFCC; border: 1px none #000000">
<div align="center"><font face="Calibri" color="#008040"><b><font size="7"><a href="Page%20d'accueil%20scans.htm"><font color="#336633">Accès
aux images numérisées</font></a></font></b></font></div>
</div>
<div id="Layer15" style="position:absolute; width:43px; height:30px; z-index:16; left: 213px; top: 629px"><img src="Bouton.gif" width="40" height="30"></div>
<div id="Layer15" style="position:absolute; width:43px; height:30px; z-index:16; left: 974px; top: 628px"><img src="Bouton.gif" width="40" height="30"></div>
<div id="Layer13" style="position:absolute; width:658px; height:86px; z-index:17; left: 287px; top: 98px; background-color: #CCFFCC; layer-background-color: #CCFFCC; border: 1px none #000000">
<table width="100%" border="1" height="83">
<tr>
<td height="79">
<div align="center"><b><font color="#008040" face="Calibri" size="+7">Flore
numérisée de Turquie</font></b></div>
</td>
</tr>
</table>
</div>
<p> <!-- DEBUT CODE compteur-gratuit.org -->
<script language="JavaScript" src="http://script.compteur-gratuit.org/count/c.js?id=2515800&t=2&d=9&n=4&s=0"></script>
<noscript> un <a target="_blank" href="http://www.compteur-gratuit.org">compteur
gratuit</a> pour votre site web</noscript> <!-- FIN CODE compteur-gratuit.org --><br>
</p>
</body>
</html>
14 janv. 2010 à 13:08
Prenez Kompozer, vous allez être agréablement surpris de sa simplicité (il est plus simple que dream avec son système de fenêtres !!)
1. Ne jamais mettre d'espaces et de caractères accentués ou spéciaux dans les noms de fichiers.
Donc, pour prendre la première image qui s'appelle Fond de la page d'accueil.jpg, renommez la (pas d'espace, pas d'apostrophe), ainsi que toutes les autres présentant les mêmes défauts. Sinon vous allez à des déconvenues.
2. Tout ce qui est <div id="layerxx"..> sont déclarés en position absolue : on ne peut donc pas les centrer ! Par aucun moyen que ce soit. Il faut donc vraiment, mais vraiment laisser tomber dream et refaire ça proprement.
14 janv. 2010 à 14:47
Merci de la réponse, je viens de télécharger Kompozer. Ce logiciel a l'air effectivement bcp plus lisible que DreamW. Je le découvre et essaie de commencer à construire ma première page. Je commence à comprendre la plupart des systèmes mais je bloque sur un élément. Dans Dreamweaver, j'utilisais systématiquement des calques dans lesquels je mettais ce que je voulais (texte, image, tableau....). Ici je ne vois pas ce système de calques. Faut il utiliser tableau comme je le faisais avec les calques? Seulement mes calques, je les déplaçais comme je voulais dans la page en les faisant glisser. Dans Kompozer, comment faire pour déplacer ces tableaux et les positionner comme on veut. Je ne trouve pas la solution pour le moment.
Merci du coup de main.
Cordialement.
Phil
14 janv. 2010 à 15:46
Avec kompozer, vous pouvez aussi créer des cadres (aller dans le menu déroulant "choisir un format de paragraphe", dernier item de ce menu "conteneur générique")
Et on peut les redimensionner avec les barres de tailles horizontales et verticales qui apparaissent en haut et à gauche de la fenêtre.
Mais bon, il faudra les positionner ensuite par CSS, et là je crois que vous n'avez pas trop envie ;)
Cela dit, utilisez ce menu pour tout mise en forme de titres et de paragraphes. Le principe est le même que pour un traitement de texte : on saisit à la volée, et seulement après on configure l'apparence avec une feuille de style.
(rah zut... je recommence à parler CSS ;) )
Pour faire une mise en page par tableaux, vous cliquez seulement sur le bouton tableau, et vous insérez les images dans vos cellules.
Et après... et bien ça dépend de ce que vous voulez obtenir.
Le plus simple serait peut-être que lorsque vous aurez fait votre page, vous nous donniez le code en nous précisant ce que vous voulez obtenir.
Car là, je risque de tomber à côté...
14 janv. 2010 à 16:22
Encore merci.