Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1300 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  ma première page sur deamweaver : problème

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

ma première page sur deamweaver : problème

n°1629618
Positivist​e
Reaction Apathique
Posté le 23-10-2007 à 19:35:49  profilanswer
 

salut à tous j'ai fais une page sous dreamwever et quand je l'ouvre avec avec IExplorer Il y a juste la trame de fpnd et une ou deux bribes d'image.
 
A quoi cela p-e du ?
 
voila ce que çà donne :
 
http://www.moughlee.homedns.org/
 
le code
 

Citation :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>menu02</title>
<style type="text/css">
<!--
#menu02 {
 position:absolute;
 left:190;
 top:25;
 width:760;
 height:80;
 z-index:1;
 background-image: url(images/menu02.png);
}
#menu03 {
 position:absolute;
 left:25;
 top:250;
 width:165;
 height:830;
 z-index:2;
 background-image: url(images/menu03.png);
}
#central {
 position:absolute;
 left:190px;
 top:250px;
 width:760;
 height:830;
 z-index:3;
 background-image: url(images/centre.png);
}
#menu01 {
 position:absolute;
 left:25;
 top:25;
 width:165;
 height:80;
 z-index:4;
 background-color: #D4D0C8;
 background-image: url(images/menu01.png);
}
body {
 background-image: url(images/fond%20page.gif);
}
.Style1 {color: #FFFF66}
#banniere {
 position:absolute;
 left:25;
 top:127.5px;
 width:920;
 height:100;
 z-index:5;
}
#Layer1 {
 position:absolute;
 left:225;
 top:37;
 width:115px;
 height:55;
 z-index:6;
 background-image: url(images/boutonmenu.gif);
}
#Layer2 {
 position:absolute;
 left:340px;
 top:37px;
 width:115px;
 height:55px;
 z-index:7;
 background-image: url(images/boutonmenu.gif);
}
#Layer3 {
 position:absolute;
 left:455px;
 top:37px;
 width:115px;
 height:55px;
 z-index:8;
 background-image: url(images/boutonmenu.gif);
}
#news {
 position:absolute;
 left:50px;
 top:37;
 width:115;
 height:55;
 z-index:9;
 background-image: url(images/boutonmenu.gif);
}
#Layer5 {
 position:absolute;
 left:570px;
 top:37;
 width:115;
 height:55px;
 z-index:10;
 background-image: url(images/boutonmenu.gif);
}
#Layer6 {
 position:absolute;
 left:685px;
 top:37;
 width:115;
 height:55px;
 z-index:11;
 background-image: url(images/boutonmenu.gif);
}
#Layer4 {
 position:absolute;
 left:820px;
 top:37;
 width:115;
 height:55;
 z-index:12;
 background-image: url(images/boutonmenu.gif);
}
#Layer7 {
 position:absolute;
 left:50;
 top:280;
 width:115px;
 height:55px;
 z-index:13;
 background-image: url(images/boutonmenu.gif);
}
#Layer8 {
 position:absolute;
 left:50px;
 top:370;
 width:115;
 height:55;
 z-index:14;
 background-image: url(images/boutonmenu.gif);
}
#Layer9 {
 position:absolute;
 left:50px;
 top:460;
 width:115;
 height:55;
 z-index:15;
 background-image: url(images/boutonmenu.gif);
}
#Layer10 {
 position:absolute;
 left:50;
 top:544px;
 width:115;
 height:55;
 z-index:16;
 background-image: url(images/boutonmenu.gif);
}
.Style2 {
 color: #CC0000;
 font-size: 24px;
}
.Style3 {font-family: "Courier New", Courier, monospace}
#Layer11 {
 position:absolute;
 left:50px;
 top:37;
 width:115;
 height:55;
 z-index:17;
 background-image: url(images/boutonmenu.gif);
}
-->
</style>
</head>
 
<body>
<div id="menu02"></div>
<div id="menu03"></div>
<div id="central">
  <p>&nbsp;</p>
  <p class="Style1">&nbsp;</p>
</div>
<div id="menu01"></div>
<div id="banniere"></div>
<div id="Layer1"></div>
<div id="Layer2"></div>
<div id="Layer3"></div>
<div id="Layer5"></div>
<div id="Layer6"></div>
<div id="Layer4"></div>
<div id="Layer7"></div>
<div id="Layer8"></div>
<div id="Layer9"></div>
<div id="Layer10"></div>
<div id="Layer11">
  <p>&nbsp;</p>
  <p><br />
  </p>
</div>
</body>
</html>


 
merci de m'aider
 
normalement je devrai arriver à ce resultat à quelque détails prés :
 
http://www.moughlee.homedns.org/co [...] s/news.htm
 
 
a+
 


---------------
ploum ploum tralala
mood
Publicité
Posté le 23-10-2007 à 19:35:49  profilanswer
 

n°1629937
mIRROR
Chevreuillobolchévik
Posté le 24-10-2007 à 11:16:24  profilanswer
 

c est facile il suffit de pas se servir de dreamweaver :/
la je suis désolé mais il faut tout refaire c est normal que ca marche pas


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
n°1629998
micfont999
Simplement Moi
Posté le 24-10-2007 à 11:52:18  profilanswer
 


 
Bonjour
 
la vache tout est en absolute ... -_-
 
aller mon lien favoris -->  
http://css.alsacreations.com/
http://css.alsacreations.com/Const [...] us-en-CSS/
http://css.alsacreations.com/Model [...] age-en-CSS
http://css.alsacreations.com/Galeries-de-menus-en-CSS
 
Ensuite quelques petits conseils :
- Importe ta page css au lieu de mettre tout dans ta page, c'est plus pratique pour reprendre les différentes choses dont tu à besoin, surtout pour un menu,

Code :
  1. <link rel="stylesheet" type="text/css" href="tapagecss.css">

sera beaucoup plus pratique pour toi ..  
 
- Renseigne toi au niveau des positions absolutes et relatives, tu risque d'avoir des emmerdent sinon, genre maintenant :)  
 

mIRROR a écrit :

c est facile il suffit de pas se servir de dreamweaver :/
la je suis désolé mais il faut tout refaire c est normal que ca marche pas


 
Pas evident pour tout le monde de ne pas ce servir de dream, ça à beau etre une belle merde qui rajoute des trucs quand on veux pas, et qui fait un code parfois dégueu, il est quand même bien pratique parfois :)  

n°1630071
mIRROR
Chevreuillobolchévik
Posté le 24-10-2007 à 12:52:35  profilanswer
 

DW peut etre un outil sympa quand tu comprends ce que tu fais ou alors couplé avec image ready
ca fait du code immonde mais fonctionnel
mais partir de but en blanc sur dreamweaver c ets suicidaire y a meme pas un seul lien sur son html et evidemment il peut pas s en rendre compte
 
et a son niveau alsacreations risque d etre un peu trop pointu
avant les css il doit apprendre le html


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
n°1630094
Positivist​e
Reaction Apathique
Posté le 24-10-2007 à 13:11:15  profilanswer
 

merci de vos réponses.
 
pour info, j'avais suivi le tuto là :
http://www.kachouri.com/tuto/tuto- [...] te-12.html


---------------
ploum ploum tralala
n°1630102
micfont999
Simplement Moi
Posté le 24-10-2007 à 13:18:53  profilanswer
 

mIRROR a écrit :

avant les css il doit apprendre le html


 
a vrai dire j'ai plutot tendance à dire que désormais l'un ne va pas sans l'autre si l'on veux quelque chose de propre ...
 

n°1630252
mIRROR
Chevreuillobolchévik
Posté le 24-10-2007 à 15:13:53  profilanswer
 

Positiviste a écrit :

merci de vos réponses.
 
pour info, j'avais suivi le tuto là :
http://www.kachouri.com/tuto/tuto- [...] te-12.html


 
ok a toi d adapter la section "ajouter des liens" avec tes images (vu que tu n utilises pas du texte)
mais pour les questions DW va plutot sur mediabox
http://creative.mediabox.fr/index.php?showforum=5
 

micfont999 a écrit :

a vrai dire j'ai plutot tendance à dire que désormais l'un ne va pas sans l'autre si l'on veux quelque chose de propre ...


 
evidemment mais chaque chose en son temps [:spamafote]


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
n°1630443
Positivist​e
Reaction Apathique
Posté le 24-10-2007 à 19:16:58  profilanswer
 

bon en fait les gars je suis tombé sur un bon tuto. http://fr.html.net/
Résultat je fais tout sur notepad et c'est bien plus interressant.
 
voila ce que j'ai fait en lisant un peu. çà reste simple c'est sur et quelques étourderie concernant les sauts de lignes et alinéa.
 
 

Code :
  1. <head>
  2. <title>voyage en Asie photographies mough-lee news</title>
  3. <link rel="stylesheet" type="text/css" href="index.css" />
  4.    </head>
  5.    <body>
  6. <br />
  7. <br />
  8. <br />
  9. <br />
  10. <br />
  11. <br />
  12. <br />
  13. <br />
  14. <br />
  15. <br />
  16. <br />
  17. <br />
  18. <br />
  19. <br />
  20. <br />
  21. <br />
  22. <br />
  23. <br />
  24. <br />
  25. <br />
  26. <br />
  27. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  28.      <a href="C:\serveur01\www\contenu\pagenews\pagenews.htm">Aventuriers au grand coeur, le voyage commence ici</a>
  29.    </body>
  30. </html>


 

Code :
  1. body {
  2.  background: #000000 url("moughleesadventure.gif" ) no-repeat fixed 50% 45%;
  3. }
  4. a:link {
  5. color: #0000CC;
  6. text-decoration:none;
  7. }
  8. a:visited {
  9. color: #993300;
  10. text-decoration:none;
  11. }
  12. a:hover {
  13. color:#FF6600;
  14. font-style: italic;
  15. text-decoration:none;
  16. }


 
La je m'attaque aux pages  avec des menu en haut avec des images dessus et menu gauyche et etc..
en gros voila ce que je souhaite (en centrant bien sur) réaliser comme gabarit
http://www.moughlee.homedns.org/co [...] s/news.htm
 
encore quelques pétard et c'est bon, je me prendrai pour néo
 
a+


Message édité par Positiviste le 24-10-2007 à 19:18:39

---------------
ploum ploum tralala
n°1630526
gooopil
pfiew
Posté le 24-10-2007 à 22:28:12  profilanswer
 

C'est un début :)
Maintenant, au lieu des sauts de ligne et les espaces insécables,  ajoute un style à ton A pour décaler ça vers le bas et la droite (indice  : margin)

 

Notepad tout court, c'est du SM par contre. DW n'est pas un mauvais éditeur de code, et puisque tu l'as... Mais en mode code, pas WYSIWYG ;)


Message édité par gooopil le 24-10-2007 à 22:30:01
n°1630918
Positivist​e
Reaction Apathique
Posté le 25-10-2007 à 14:26:29  profilanswer
 

Yes margin effectué. Merci
 
étape une : création page d'accueil.
étape 2: création gabarit des pages. selon le modèle suivant :
 
http://images2.hiboox.com/vignettes/4307/ugo8hhkn.jpg
 
la partie 1 (menutop), 2(bannière), 3(menuleft), 4(body) corespondent à des banières et menu fait précédemment avec un logiciel, en format .png.
La partie 5 en haut (qui ressemble fortement à un 4) correspond à la marge.
la partie 6 en rouge est un cadre noir.
La partie 0 est le background de la page.
Les dimensions données sont en px.
 
 
Ce forum et ce post en particulier va me servir de plateforme de travail et pourquoi pas d'aide au débutant tout comme moi.


Message édité par Positiviste le 25-10-2007 à 14:42:04

---------------
ploum ploum tralala
mood
Publicité
Posté le 25-10-2007 à 14:26:29  profilanswer
 

n°1630937
Positivist​e
Reaction Apathique
Posté le 25-10-2007 à 14:35:06  profilanswer
 

Partie 0 : background
 
htlm :

Citation :


<htlm>
             <head>
 <title>voyage orient asie monde</title>
 
 <link rel="stylesheet" type="text/css" href="general.css" />
   </head>
 
   <body>  
 </body>
 
</html>


 
css/

Citation :

body {
  background: url("C:\serveur01\www\images\fondpage.gif" ) repeat fixed;
 
}

Message cité 1 fois
Message édité par Positiviste le 25-10-2007 à 14:36:00

---------------
ploum ploum tralala
n°1630962
micfont999
Simplement Moi
Posté le 25-10-2007 à 15:22:22  profilanswer
 

Positiviste a écrit :

Partie 0 : background
 
htlm :

Citation :


<htlm>
             <head>
 <title>voyage orient asie monde</title>
 
 <link rel="stylesheet" type="text/css" href="general.css" />
   </head>
 
   <body>  
 </body>
 
</html>


 
css/

Citation :

body {
  background: url("C:\serveur01\www\images\fondpage.gif" ) repeat fixed;
 
}



 
si tu peux evite les lien absoluent, ils te poseront problème à un moment ou un autre..
Préfère leur les liens relatifs surtout dans ce cas d'image ...  
un bon  

Code :
  1. background-image: url(images/fondpage.gif) repeat fixed;


 
suffira amplement et t'évitera bien des soucis :)  
 :hello:

n°1630963
gooopil
pfiew
Posté le 25-10-2007 à 15:25:13  profilanswer
 

micfont999 a écrit :


 
si tu peux evite les lien absoluent, ils te poseront problème à un moment ou un autre..
Préfère leur les liens relatifs surtout dans ce cas d'image ...  
 


T'as un problème avec la construction du pluriel je crois ^^

n°1630964
micfont999
Simplement Moi
Posté le 25-10-2007 à 15:28:05  profilanswer
 

hey mais non j'ai pas fait gaffe roh :kaola:   :whistle:


Message édité par micfont999 le 26-10-2007 à 08:43:12
n°1631041
Positivist​e
Reaction Apathique
Posté le 25-10-2007 à 16:29:34  profilanswer
 

ok; je prend note.merci.
 

Citation :

body {
  background: url("../images/fondpage.gif" ) repeat fixed;


Message édité par Positiviste le 25-10-2007 à 16:30:17

---------------
ploum ploum tralala
n°1631101
Positivist​e
Reaction Apathique
Posté le 25-10-2007 à 16:57:13  profilanswer
 

positionnement de mes menu et barrière :
 

Citation :


 
   <body>  
<img src="../images/menutop.png" style="position:relative;"\>
<img src="menuleft.png" style="position:relative;top:110px;"\>
<img src="../images/bannièreadventure.gif"  
style="position:relative;top:-825px;"\>
<img src="../images/body.png"  
style="position:relative;top:-815px;left:165px;"\>
 </body>
 
</html>


 
css

Citation :


body {
  background: url("../images/fondpage.gif" ) repeat fixed;
 margin: 25px 25px 0px 25px;
}


Il me reste à mettre le cadre 6
voilà, comme vous l'aurez remarqué, j'ai tous placé en utilisant "position:relative" et ds le fichier htlm.
 
 
Donc prochaine étape, mettre ds le fichier .css, avec p-ê une autre méthode plus adapté et efficace que que "position:relative" sachant que sur ces images, je compte mettr du texte, des images, des liens ?
 
a+


Message édité par Positiviste le 25-10-2007 à 17:18:58

---------------
ploum ploum tralala
n°1634160
Positivist​e
Reaction Apathique
Posté le 30-10-2007 à 22:02:45  profilanswer
 

salut à tous !
 
mon site avance à pas de fourmies mais il avance.
 
Je bloque sur un point ou deux : l'insertion du menu de gauche "id menu"
 
htlm

Citation :


   <head>
 <title>voyage orient asie monde</title>
 
 <link rel="stylesheet" type="text/css" href="pagenews.css" />
   </head>
 
   
   <body>
 
     
 
       <div id="en_tete">
           
       </div>
 
       <div id="banniere">
           
       </div>
   
       <div id="menu">        
                                       
       </div>
 
       <div id="corps">        
                                       
       </div>


 
css

Citation :

body
{
   width: 975px;
   margin-top: 20px;
   margin-bottom: 20px;    
   background-image: url("../images/fondpage.gif" );
}
 
 
 
#en_tete
{
   width: 925px;
   height: 82px;
   background-image: url("../images/menutop.png" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 
#banniere
{
   width: 925px;
   height: 85px;
   background-image: url("../images/bannièreadventure.gif" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 
#menu
{
   float: left
   margin-bottom: 10px;
  background-image: url("../images/body.png" );
}

#corps
{
   margin-left: 165px;
   width: 760px;
   height: 830px;
   padding: 5px;
   background-image: url("../images/body.png" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 


 
volia le problè, le menu soit n'apparait pas ou il apparait et le corps n'est plus à sa place.
Si vous pouviez m'aider svp
 
merci a+


---------------
ploum ploum tralala
n°1634165
mIRROR
Chevreuillobolchévik
Posté le 30-10-2007 à 22:08:06  profilanswer
 

a priori j enleverai le margin sur ton #corps


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
n°1634797
Positivist​e
Reaction Apathique
Posté le 31-10-2007 à 16:10:35  profilanswer
 


htlm

Citation :


   <head>
 <title>voyage orient asie monde</title>
 
 <link rel="stylesheet" type="text/css" href="pagenews.css" />
   </head>
 
   
   <body>
 
     
 
       <div id="en_tete">
           
       </div>
 
       <div id="banniere">
           
       </div>
   
       


 
css

Citation :

body
{
   width: 975px;
   margin-top: 20px;
   margin-bottom: 20px;    
   background-image: url("../images/fondpage.gif" );
}
 
 
 
#en_tete
{
   width: 925px;
   height: 82px;
   background-image: url("../images/menutop.png" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 
#banniere
{
   width: 925px;
   height: 85px;
   background-image: url("../images/bannièreadventure.gif" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 
 


 
Bon reprenons le problème :
Actuellement j'ai inséré 1 menu horizontal qui accueillera du texte, en-dessous une bannière. Maintenant, je souhaite insérer mon menu vertical.png 165x830px et mon corprs.png 760x830 tangeant à mon menu. Mais je n'y arrive pas. problème de balise je pense et d'utilisation de celle-ci.
 
help svp.
 
a+


Message édité par Positiviste le 31-10-2007 à 16:26:00

---------------
ploum ploum tralala
n°1634864
mIRROR
Chevreuillobolchévik
Posté le 31-10-2007 à 17:31:33  profilanswer
 

url :/


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
n°1634929
Positivist​e
Reaction Apathique
Posté le 31-10-2007 à 20:16:49  profilanswer
 

scuse moi, je recommence :
 
 
Pour l'instant voilà ce que j'ai pu faire:
http://www.moughlee.homedns.org/co [...] genews.htm
 
css
 

Citation :

body
{
   width: 975px;
   margin-top: 20px;
   margin-bottom: 20px;    
   background-image: url("../images/fondpage.gif" );
}
 
 
 
#menutop
{
   width: 925px;
   height: 82px;
   background-image: url("../images/menutop.png" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 
#banniere
{
   width: 925px;
   height: 85px;
   background-image: url("../images/bannièreadventure.gif" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 
#menuleft
{
   
   width: 165px;
   height: 830px;
   background-image: url("../images/menuleft.png" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
 
#corps
 
{
   margin-left: 165px;
   width: 925px;
   height: 830px;
   background-image: url("../images/body.png" );
   background-repeat: no-repeat;
   margin-bottom: 10px;
}


 
html

Citation :

<head>
 head>
 <title>voyage orient asie monde</title>
 
 <link rel="stylesheet" type="text/css" href="pagenews.css" />
   </head>
 
   
   <body>
 
     
 
       <div id="menutop">
           
       </div>
 
       <div id="banniere">
           
       </div>
 
       <div id="menuleft">
           
       </div>
 
       <div id="corps">
 
       </div>
 
   
   </body>


 
Je n'arrive pas à placer l'image body.png, tangent au menu de droite..
 
Pouvez vous m'aidez  svp ?
Est ce que j'ai choisi la méthode adéquate si je souhaite mettre des liens sur les boutons jaunes des deux menus et du texte ou des scripts sur le corps ?
 
merci d'avance et à plus

Message cité 1 fois
Message édité par Positiviste le 31-10-2007 à 20:19:34

---------------
ploum ploum tralala
n°1635034
mIRROR
Chevreuillobolchévik
Posté le 01-11-2007 à 10:16:30  profilanswer
 

Positiviste a écrit :

Je n'arrive pas à placer l'image body.png, tangent au menu de droite..


 
ton serveur est tombé  
mais je repete ma precedente remaque retire ton margin left sur le corps et au passage tu a changé le width de ce dernier ce qui est une erreur
 

Positiviste a écrit :

Est ce que j'ai choisi la méthode adéquate si je souhaite mettre des liens sur les boutons jaunes des deux menus et du texte ou des scripts sur le corps ?
 
merci d'avance et à plus


 
si tu a donné tout ton code html surement pas  
il n y a aucun lien dedans [:petrus75]


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  ma première page sur deamweaver : problème

 

Sujets relatifs
[VBA EXCEL] Problème avec partage de classeur !! Problème d'insertion dans une table sous oracle
Problème de conversion string en const char *Problème de cookies
[QST]Page Rankprobleme de dichotomie sur visual C++
Problème requête betweenProblème pour générer la DTD de fichiers XML
[resolu]Affichier resultat de ma requete dans un cadre de ma page PHP[ALGO] probléme sur un algo
Plus de sujets relatifs à : ma première page sur deamweaver : problème


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR