Bonjour,

Je suis en licence pro atc et j'ai un tp de html à faire. J'ai jamais rien fait de tou ça.

Je dois refaire une page html avec plusieurs menu dans une même page.

Comment je dois écrire le code html pour ke ça face des liste bien propre avec des puces comme ça : >

Le prof est nul il explique pour ceux qui savent déjà.

Aidez moi SVP

Bonjour,

Quels types de menus, verticaux, horizontaux, avec des images, des cases,.... où dans la page, à droite, au milieu, l'un en dessous de l'autre ?

@+

Il faut refaire ce site en fait :

http://www.quadrissimo.com/

Donc j'ai refait tout le cadre noir et le brun, j'ai intégré les cube de couleurs avec Dreamweaver mais il me manque le menu dans chaque cube.

Merci d'avance

@urore a écrit :

Il faut refaire ce site en fait :

http://www.quadrissimo.com/

Donc j'ai refait tout le cadre noir et le brun, j'ai intégré les cube de couleurs avec Dreamweaver mais il me manque le menu dans chaque cube.

Merci d'avance

Euh, si t'affiches le code source du dit site ?

Oui j'y ai pensé mais c'est un tp noté donc interdiction de tricher tu vois.

J'ai regardé le code mais ça m'a pas apporté de réponse vu que c'est noté et que le prof va s'appercevoir si on a triché ou pas !

Re,

Je comprends pas trop le problème.

En prenant le code HTML et le code CSS de l'adresse que tu indiques, on obtient bien ta page et les menus sont actifs, qu'est-ce que tu veux faire d'autre ?

D'ailleurs je ne vois pas pourquoi tu prends Dreamweaver, il est préférable de coder directement. Tes cubes sont des DIV placés côte à côte avec pour chacun une image en background et les menus à l'intérieur

Par exemple, le premier cube avec le CSS "petitsformats" :

<div id="petitsformats" title="Atelier petits formats">

<h3>Service d'impression petits formats</h3>
<ul>
<li><a href="petits_formats.htm">> Flyers </a></li>
<li><a href="petits_formats.htm">> Plaquettes </a></li>
<li><a href="petits_formats.htm">> Cartons d'invitation </a></li>
<li><a href="petits_formats.htm">> Cartes de visite </a></li>
<li><a href="petits_formats.htm">> Dossiers/reliures </a></li>
</ul>
</div>

Le CSS "petitsformats" est le suivant :

#petitsformats
{
position: absolute;
left: 30px;
height: 317px;
width: 220px;
background-image: url(images/accueil/acc1.gif);
margin: 0px;
padding: 0px;
}

@+

@urore a écrit :

Oui j'y ai pensé mais c'est un tp noté donc interdiction de tricher tu vois.

J'ai regardé le code mais ça m'a pas apporté de réponse vu que c'est noté et que le prof va s'appercevoir si on a triché ou pas !

Tricher n'est pas mon genre et par ma réponse je n'envisageais aucune tricherie. Il faudrait d'ailleurs définir à partir de quel moment la triche commence, dans la mesure où tu sollicites dans un forum la réponse au problème qui t'est posé.

Mon idée était tout simplement de lire le code, le comprendre et en écrire un qui corresponde à l'énoncé.

Ton premier message indique je dois écrire le code html pour ke ça face des liste bien propre avec des puces [sic], ce n'est pas Dreamweaver qui va te permettre d'écrire du code html, il va en générer «à sa sauce» et à mon avis cela ne correspondra pas à un TP de HTML mais à un TP de Dreamweaver, ce qui est bien différent.

Merci pour vos réponses ça m'éclaircit un peu les idées !

Ben pour le tp , le prof veut qu'on fasse ça sur Dreamwever.

Pour ce qui est de la triche, étant donné que le cours est vide, à mon sens, et que je comprends pas tout vu que c'est la première fois que je touche à du html je pense que c'est normal que je demande de l'aide vu qu'il nous à jamaisexpliquer franchement comment on fait un menu.

Y.bli, il faut que je refasse cette page web en fait. En fait c'est vraimant par hasard qu'on est tombé sur le site. On est pas censé savoir qu'il existé car le prof nous à donné 2 fichiers photoshop qu'il faut mettre en html.

Bref je suis pas douée du tout car c'est pas du tout mon parcours à la base.

Pardonnez moi de mon ignorance

RE,

Bon alors, qu'est-ce que tu voudrais exactement ? Essaie d'être un peu plus précise sur ce que tu dois faire : toute la page telle qu'elle est (là c'est facile, tu as tout le code), quelques menus qui ressemblent à cette page, ...

Par contre, Dreamwever, je n'utilise pas.

@+

Ben en fait je voudrais savoir qu'est ce que je dois érire pour faire un menu.

et Est ce qu'il faut que je répète la même opération pour faire chaque menu ?

On a fait un tp avant celui dont je vous parle et on a écrit ça pour faire le menu :

<div id="menu"><ul>
<li><a href="page1.htm" class="actif">La loi</a> </li>
<li><a href="page2.htm">SoliMar en bref</a> </li>
<li><a href="../entreprises/index.htm">Entreprises </a></li>
<li><a href="../intermediaires_emploi/index.htm">Interm&eacute;diaires &agrave; l'emploi </a></li>
<li><a href="../groupe_pairs/index.htm">Groupe des pairs </a></li>
<li><a href="../documentation/index.php">Documentation</a> </li>
<li><a href="../liens.htm">liens</a> </li>
</ul></div>

Re,

Dans la partie <head> de ta page, tu tapes :

<style type="text/css">

#menu1
{
position: absolute;
left: 30px;
height: 317px;
width: 220px;
margin: 0px;
padding: 0px;
}

#menu2
{
position: absolute;
left: 260px;
height: 317px;
width: 220px;
margin: 0px;
padding: 0px;
}

#menu3
{
position: absolute;
left: 722px;
height: 317px;
width: 220px;
margin: 0px;
padding: 0px;
}

</style>

dans la partie <body> de ta page, tu tapes :

<div id="menu1"><ul>
<li><a href="page1.htm" class="actif">>La loi</a> </li>
<li><a href="page2.htm">>SoliMar en bref</a> </li>
<li><a href="../entreprises/index.htm">>Entreprises </a></li>
<li><a href="../intermediaires_emploi/index.htm">>Interm&eacute;diaires &agrave; l'emploi </a></li>
<li><a href="../groupe_pairs/index.htm">>Groupe des pairs </a></li>
<li><a href="../documentation/index.php">>Documentation</a> </li>
<li><a href="../liens.htm">>liens</a> </li>
</ul></div>

<div id="menu2"><ul>
<li><a href="page1.htm" class="actif">>La loi</a> </li>
<li><a href="page2.htm">>SoliMar en bref</a> </li>
<li><a href="../entreprises/index.htm">>Entreprises </a></li>
<li><a href="../intermediaires_emploi/index.htm">>Interm&eacute;diaires &agrave; l'emploi </a></li>
<li><a href="../groupe_pairs/index.htm">>Groupe des pairs </a></li>
<li><a href="../documentation/index.php">>Documentation</a> </li>
<li><a href="../liens.htm">>liens</a> </li>
</ul></div>

<div id="menu3"><ul>
<li><a href="page1.htm" class="actif">>La loi</a> </li>
<li><a href="page2.htm">>SoliMar en bref</a> </li>
<li><a href="../entreprises/index.htm">>Entreprises </a></li>
<li><a href="../intermediaires_emploi/index.htm">>Interm&eacute;diaires &agrave; l'emploi </a></li>
<li><a href="../groupe_pairs/index.htm">>Groupe des pairs </a></li>
<li><a href="../documentation/index.php">>Documentation</a> </li>
<li><a href="../liens.htm">>liens</a> </li>
</ul></div>

J'ai mis les mêmes menus 3 fois, mais tu peux évidemment changer et j'ai ajouté le symbole ">" devant chaque intitulé de menu

@+

ouha ! C'est super coool ! Merci je vais essayé ce weekend.

Merci !

Je vous tiens au courant

@urore a écrit :

ouha ! C'est super coool ! Merci je vais essayé ce weekend.

Merci !

Je vous tiens au courant

Change peut-être les dimensions des 3 DIV (menu1, menu2 et menu3) si tu ne veux pas que ce soit exactement la même chose, par exemple height=320px et width=215px et tu places exactement leurs positions comme tu veux en ajustant le paramètre 'left"

@+

Ben voilà j'ai réussit à faire mes menus !!!!!!

Per contre j'avais des polices à faire sous cette forme : >

et donc j'ai fait un gif que j'ai intégrer comme puces.

Ben voilà merci à vous !!!!

Bonjour,

Ben voilà j'ai toujours pas fini mon tp et je dois le rendre le 30 !!!!

Il faut queje fasse un chemin de fer et j'arrive pas à mettre tout ça à l'horizontal.

HTML :

div id ="chemin de fer">

• >Accueil


• >Flyers


• >Plaquette


• >Carton d'invitation


• >Carte de visite


• >Dossier/reliure

CSS :

#chemin de fer ul {
left: 10px;
top: 200px;
}
#chemin de fer li {
font-family: Arial, Helvetica, sans-serif;
color: #FFFFFF;
left: 10px;
top: 500px;
}
#chemin de fer li a {
font-family: Arial, Helvetica, sans-serif;
color: #FFFFFF;
text-align: left;
}

Soit un truc trop laid :

Comment je peux faire pour mettre le chemin de fer en blanc sans les petit point ?

Ce que j'ai mis à présent marche pas Et surtout comment on fait pour que ça soit aligné ainsi :

>Accueil >Flyers >Plaquette >Carton d'invitation >Carte de visite >Dossier/reliure

SVP

Je n'ai pas trop le temps présentement, mais pour mettre la liste à l'horizontale, tu mets un display:inline dans le style de la liste. Pour enlever les puces, c'est list-style-type: none;

Pour la couleur, c'est celle des liens qu'il faut modifier...

J'ai fait quelques modifications mais ça n'a rien fait

Voici mon css :

#chemin de fer ul {
float:left;
list-style-type:none;
display:inline;
padding:0;
margin:0;
}
#chemin de fer li {
float:left;
left: 10px;
top: 500px;
}
#chemin de fer li a {
float:left;
font-family: Arial, Helvetica, sans-serif;
color: #FFFFFF;
text-align: left;
}

Et ton code HTML, il est comment?

Utilise pour le mettre sur le forum afin qu'il ne soit pas interprété...

J'ai enlevé tout les float. Je les avais mis pour voir si ça déplacer le menu.

Mon HTML :

<div id ="chemin de fer">       
<ul>
      <li><a href="Accueil.html">> Accueil</a></li>
      <li><a href="rub1.htm">> Flyers</a></li>
      <li><a href="rub1a.htm">> Plaquette</a></li>
      <li><a href="rub1b.htm">> Carton d'invitation</a></li>
      <li><a href="rub1c.htm">> Carte de visite</a></li>
      <li><a href="rub1d.htm">> Dossier/reliure</a></li>
</ul></div>

J'ai déplacé les puces : > dans le lien.

Si tu veux mettre >, il faut utiliser les caractères spéciaux car il s'agit d'un caractère de balisage qui risque d'induire le navigateur en erreur :

http://www.commentcamarche.net/html/htmlcarac.php3

Ben je le ai mis en code mais c'est le forum qui a modifier ce que j'ai marqué soit le: & gt;

tout à ligné bien sûr et pas d'espace.

Si tu tiens à un id de trois mots, réunis-les par _ : chemin_de_fer

Comme ça, ça fonctionne, avec les float:left...

@urore a écrit :

Ben je le ai mis en code mais c'est le forum qui a modifier ce que j'ai marqué soit le: & gt;

tout à ligné bien sûr et pas d'espace.

Ah ok.