Ne pas mettre de menu "XHTML"

myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention   -  
 myraff -
Bonjour a tous et a toutes,

J'ai une question a la fois bête mais très intéresante " surtout pour moi "


Voila j'aimerait pas mettre de menu dans mon site juste laisser le corps, l'en_tête et le pieds est-ce que c'est possible ?
A voir également:

26 réponses

Gihef Messages postés 5150 Date d'inscription   Statut Contributeur Dernière intervention   2 779
 
C'est une solution.
Mais tu peux peut-être t'y prendre autrement.


En reprenant l'exemple.
— En haut, l'en-tête.
    Avec le logo, une bannière…
— En-dessous, le menu.
    Sur toute la largeur.

— Encore en-dessous, 2 parties :
  - un gauche, pour mettre ce que tu veux
  - le corps, où seront les infos

— Enfin, un pied de page.
    Pour les mentions légales (le copyright…)

C'est souvent utilisé.
On trouve des exemples prêts à l'emploi (ou presque).
Comme celui-là où il suffit d'ajouter le menu entre l'en-tête et les 2 parties.
On trouve aussi avec une partie à droite. et là, le menu du haut est intégré.
Ils appellent les parties gauche et droite “Menu” mais on en fait ce qu'on veut.


Tu pourrais bien-sûr faire encore autrement.

--
1
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
salut,

tout est possible mais il faut penser à tes visiteurs, ils doivent pouvoir naviguer d'une page à l'autre à travers le site (sans utiliser le bouton "Précédent").
0
myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
oui mais j'avais pensé a un menu dynamique que je metterait dans le corps mais j'ai vue que tout comme fait j'aurait comme même besoin du menu car j'aurais une parti de téléchargement donc j'aimerait mettre à ma gauche une liste a ma droite biensure l'iframe ^^ voici un exemple de ce que je voudrait faire http://mangosims2.free.fr/ c'est exatement pareille que je veux faire au niveau du codage sauf que moi biensure le logos sera centrer est le corps juste ensous du logos ^^
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
tu peux faire tout cela sans '<iframe>' et sans tableau, ce sera même beaucoup mieux.

pour le menu je crois que l'on s'est mal compris.
un menu ça ne ressemble pas forcement à un menu classique.
un menu c'est simplement une liste de liens qui permet de naviguer dans le site, après tu la présente comme tu en as envie, en haut, en bas, à droite ou à gauche, avec que du texte ou décoré avec des images !
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Gihef Messages postés 5150 Date d'inscription   Statut Contributeur Dernière intervention   2 779
 
Bonjour vous,

Pour l'illustrer.
Un menu, “Look Constructions, Meubles…”
C'est le menu de la page que tu cites.

--
0
myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
A d'accord donc le corps il peut faire la largeur du logo que j'ai ? comme ca je mes le menu dans le corps enfin je le descend jusqu'au corps pour donne genre qui a étais créer sous le corps
0
myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Pour la parti gauche comment l'ajouter ? puis je voulait te demander est-ce que le css poura faire l'affaire si je mes mon gros logo dans l'en_tête pour qui soit coller avec le menu qui ce trouvera juste ensous
0
myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Je voulait savoirs pour le menu c'est possible de faire de ce genre

<div id="menu">

<ul>
<table>
<tr>
<td><li><a href="look.htm">HOME</a></li></td>
<td><li><a href="constructions.htm">DOWNLOAD</a></li> </td>
<td><li><a href="faqs.html">FAQs</a></li></td>
<td><li><a href="divers.htm">PARTENAIRES</a></li></td>
<td><li><a href="index.htm">CONTACT</a></li> </td>
</tr>
</table>
</ul>
</div>
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
salut,

le mieux c'est d'utiliser une liste. le tableau ne doit pas servir à faire de la mise en page.
toi tu as mélangé les deux, suffit d'enlever le tableau et ce sera parfait !
<div id="menu">
	<ul>
		<li><a href="look.htm">HOME</a></li>
		<li><a href="constructions.htm">DOWNLOAD</a></li>
		<li><a href="faqs.html">FAQs</a></li>
		<li><a href="divers.htm">PARTENAIRES</a></li>
		<li><a href="index.htm">CONTACT</a></li>
	</ul>
</div>
0
myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Je c'est mais ca me centre pas le menu enfin bref j'ai un autres souci c'est que le corps me cache le menu donc est-ce que c'est possible d'enlever le menu puis par la suite ajouter un table avec des liens via au autres pages ou il y a une méthode ?
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
stop !!!
il ne faut pas confondre structure du document et présentation !!!

en premier il faut écrire une page html avec tout ce que tu veux dedans (menu, texte, images…) après seulement tu vas le mettre en page.

que le menu ne soit pas centré c'est normal, tu n'as pas encore mis le code de mise en page (= CSS). mais cela ne veut pas dire que la liste de lien doit être changée !!!

dis nous à quoi doit ressembler ta page et on va te guider !
0
myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Tu ma pas répondu a ma question =( sinon voici la maquette de mon site https://i19.servimg.com/u/f19/11/18/82/43/maquet10.jpg

Voici le code que j'ai fait deja


Html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html lang="fr" xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">

<head>
<title> ~_|_~ SimsDesign ~_|_~ </title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Author" lang="fr" content="SimsDesign" />
<meta name="Keywords" lang="fr" content="sims,sims2,simsdesign,Simsdesign,sims,Design,design,Moderne,moderne,telechargements,telechargement" />
<meta name="Description" content=" SimsDesign le design réserver qu'aux sims " />

<link rel="stylesheet" media="screen" type="text/css" title="design espace" href="css/style.css" />


<style>

<!--
Body{
Cursor: crosshair;
}
-->

</style>



</head>

<body>

<div id="en_tete"></div>



<div id="corps">
<table>
<tr>
<td><a href="look.htm">HOME</a></td>
<td></td>
<td><a href="constructions.htm">DOWNLOAD</a></td>
<td></td>
<td><a href="faqs.html">FAQs</a></td>
<td></td>
<td><a href="divers.htm">PARTENAIRES</a></td>
<td></td>
<td><a href="index.htm">CONTACT</a></td>
</tr>
</table>
<p></p>
</div>

<div id="pied_de_page">
<h6>Copyright © 2007-2008 <a href="mailto:raff_webmaster@hotmail.fr">SimsDesign</a></h6>
</div>

</body>
</html>


Css


body
{
background-image: url("images/fond.jpeg");
width: -30px;
margin-left: auto;
margin-right: auto;
background-color: #202020;
font-family:"Times New Roman", Arial, Times, sans-serif;
}

a
{
color: #772300;
text-decoration: none;
}

a:hover
{
color: #929189;
}

#en_tete
{
width: 855px;
height: 159px;
margin-left: 79px;
margin-top: 20px;
border: 2px ridge #929189;
background: url("images/logo_simsdesign.jpg") center no-repeat;
}

#menu
{
width: 100%;
float: center
}

li
{
font-size: large;
margin-right: auto;
margin-top: 10px;
float: left;
background-color: none;
color: white;
list-style-type: none;
}

#corps
{
width: 815px;
height: 450px;
margin-left: 79px;
margin-top: -2px;
padding: 20px;
background-color: white;
color: black;
text-align: justify;
border: 2px ridge #929189;
}

#pied_de_page
{
width: 900px;
clear: left;
margin-top: 200px;

color: white;
text-align: center;
}

h4
{
text-align: right;
font-family: Ariel;
font-size: 20px;
text-align: center;
font-style: normal;
}
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
Tu ma pas répondu a ma question
mais si !

en premier : ta maquette est très jolie !

reste plus qu'à la coder.

tu as donc :
• une bannière ;
• un menu sous la bannière;
• un sous-menu à gauche ;
• un contenu sur le reste de la largeur ;
• un pied de page.

dans ton code tu as bien codé toutes les parties sauf pour le menu, le sous-menu et le contenu.
<div id="menu">
	<ul>
		<li><a href="look.htm">HOME</a></li>
		<li><a href="constructions.htm">DOWNLOAD</a></li>
		<li><a href="faqs.html">FAQs</a></li>
		<li><a href="divers.htm">PARTENAIRES</a></li>
		<li><a href="index.htm">CONTACT</a></li>
	</ul>
</div>
<div id="sous-menu">
	<ul>
		<li><a href="salon.htm">salon</a></li>
		<li><a href="chambre.htm">chambre</a></li>
		<li><a href="cuisine.html">cuisine</a></li>
		<li><a href="sam.htm">salle à manger</a></li>
		[...]
	</ul>
</div>
<div id="content">

</div>

tu me dis si tu es ok avec ça et on continue sur la CSS !!!
0
myraff Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
C'est normal qu'il me donne tout a gauche ? enfin en gros oui je suis près on vera pas la suite ;)
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
la base est bonne, tu l'as pris chez AlsaCréations ?
maintenant regarde mes modifs :
j'ai mis en commentaire les valeurs qu'il faut supprimer et quand j'ai ajouté des règles je les ai encadré avec '/* +++ */' pour que tu comprennes plus facilement.
j'ai aussi mis un ou deux commentaires.
body
{
background-image: url("images/fond.jpeg");
width: -30px; /* indique la largeur de ton site */
margin-left: auto;
margin-right: auto;
background-color: #202020;
font-family:"Times New Roman", Arial, Times, sans-serif; /* serif ou sans-serif il faudrait choisir !!! */
}

a
{
color: #772300;
text-decoration: none;
}

a:hover
{
color: #929189;
}

#en_tete
{
/* width: 855px; */
height: 159px;
/* margin-left: 79px; */
/* margin-top: 20px; */
border: 2px ridge #929189;
background: url("images/logo_simsdesign.jpg") center no-repeat;
}
#menu
{
width: 100%;
/* float: center */
text-align:center;
}
/* +++ */
ul
{
margin:0;
padding:0;
}
/* +++ */
li
{
font-size: large;
/*  margin-right: auto; */
margin-top: 10px;
float: left;
background-color: none;
color: white;
list-style-type: none;
}
/* +++ */
div#sous-menu
{
width:160px;
float:left;
}
/* +++ */
#content
{
/* width: 815px; */
height: 450px;
/* +++ */
margin-left: 160px; 
/* +++ */
/* margin-left: 79px; */
/* margin-top: -2px; */
padding: 20px;
background-color: white;
color: black;
text-align: justify;
border: 2px ridge #929189;
}

#pied_de_page
{
/* width: 900px; */
clear: left;
margin-top: 200px;
color: white;
text-align: center;
}
h4
{
/* text-align: right; */
font-family: Ariel; /* excellent !!! */
font-size: 20px;
text-align: center;
font-style: normal;
}
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
au passage j'ai fait un petit essai et j'ai corrigé un peu.
ça commence à prendre forme !
0
Gihef Messages postés 5150 Date d'inscription   Statut Contributeur Dernière intervention   2 779
 
Salut toi,

Ajout-lui dès maintenant un scroll au content.
  (-:

--
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922 > Gihef Messages postés 5150 Date d'inscription   Statut Contributeur Dernière intervention  
 
salut,

ayé, j'ai fignolé un peu l'essai au passage !
mais je me demande si notre simsonnien n'a pas pris peur…
-:o(
0
myraff
 
Bonjour,

J'ai fini d'enlever et d'ajouter dans la feuille de style.css

Voici le code

body
{
background-image: url("images/fond.jpeg");
width: -30px; /* indique la l'argeurs du site */
margin-left: auto;
margin-right: auto;
background-color: #202020;
font-family:"Times New Roman", Arial, Times;
}

a
{
color: #772300;
text-decoration: none;
}

a:hover
{
color: #929189;
}

#en_tete
{
height: 159px;
border: 2px ridge #929189;
background: url("images/logo_simsdesign.jpg") center no-repeat;
}

#menu
{
width: 100%;
text-align:center;
}

ul
{
margin:0;
padding:0;
}

li
{
font-size: large;
margin-top: 10px;
float: left;
background-color: none;
color: white;
list-style-type: none;
}

div#sous-menu
{
width:160px;
float:left;
}

#content
{
height: 450px;
margin-left: 160px;
padding: 20px;
background-color: white;
color: black;
text-align: justify;
border: 2px ridge #929189;
}


#corps
{
width: 815px;
height: 450px;
padding: 20px;
background-color: white;
color: black;
text-align: justify;
border: 2px ridge #929189;
}

#pied_de_page
{
clear: left;
margin-top: 200px;
color: white;
text-align: center;
}

h4
{
font-family: Ariel;
font-size: 20px;
text-align: center;
font-style: normal;
}

et voici le résultat sur ce site : http://cityofsims2.free.fr
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
salut,

la largeur du '<body>' n'est pas définie.
as-tu regardé mon essai ?
0
myraff
 
Bonjour,


Donc je doit mettre plus ou moins que 30 ?

Pour ton essai je suis owo c'est super bien précis j'ai hate d'en arriver la lol parcontre faqs, home ... n'auronts pas tous le liste de téléchargement donc est-ce que c'est possible de l'enlever pour les autres pages ?
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
re,

Donc je doit mettre plus ou moins que 30 ?
il faut mettre la largeur que tu souhaites pour le cadre principal, moins la valeur des bordures si tu en utilises. et pas de valeurs négatives !

Pour ton essai
cet exemple, tu peux l'utiliser : je l'ai fait pour ça !
regarde le code source.
ajoute les règles au fur et à mesure si tu veux apprendre en même temps (suffit d'aller chercher la définition des règles sur le net, chez W3School ou SelfHTML par exemple). ou alors tu copies/colles cash !
-;o)

parcontre faqs, home ... n'auronts pas tous le liste de téléchargement donc est-ce que c'est possible de l'enlever pour les autres pages ?
pour les autres pages tu les construits en y mettant ce que tu veux, sous-menu ou pas sous-menu.
0
myraff
 
Bonjour,

Oula le code css est long et assez complexe puis j'autiens pas le même resultat que toi :/ il y a un code plus court :\ ou une autre methode car personellement je n'arriverait pas à retenir tout le code :s
0