Pouvez vous m'aider ... j'aimerais bien pouvoir etre capable de créer mon site web... sa fait maintenant 3 fois que je li et relis les cours sur le (x)xtml et le css.. mais voila que je m'embrouille... je sais plus ou donner de la tête... sa fait 2 site web que je fais... mais.. avec l'Aide de mateo.. avez vous des conseils a me donner pour pouvoir en créer un.. ou me donner un exemple car je suis très visuel (si possible, code source d'une page pour m'aider a voir plus clair..)
merci a l'Avance.. je sais que vous pouvez m'Aider!
En faite ce que tu ne comprend pas, c'est la composition du site web.
Et mateo en propose une dans son TP de fin de cours.
Donc en gros tu nous demande de te filer un code tt pret que tu pourai reprendre?
voila.. ce que je comprend pas c'est que quand je fait la composition de ma page.. ( header..footer..) la page est décalée.. et sa m'embrouile car je ne sais plus ou donner de la tete.. mon header est en haut avec la banniere bien en place.. (tout est normal jusqu'ici) mias quand viens le tour d'y insérer le menu et le contenu de la page a coté... le site décale. c'est a dire que le menu est au dessus du contenu du site..
pouvez vous m'aider.. j'ai besoin de vous sérieusement
Tu dois appliquer un float: left (ou right) à ton menu. Essaie de voir le résultat.
Sinon, en suivant le cours de M@teo (et en particulier son TP), ça devrait aller. Tout y est expliqué très très clairement. On aura du mal à te donner de meilleures explications.
Bon alors au lieu de continuer dans les posts inutiles, il vaut mieux que tu nous donnes ta page directement sur le forum (soit en nous donnant le lien de ta page ou alors en nous copiant le code source). J'espère que c'est un peu plus clair maintenant!
<div id="corps">
<h1>Bienvenue sur mon site!!</h1>
<p class="important"> Ici, vous pourrez vous renseignez sur plusieurs chose sur le superbe jeu: Gta San Andreas!!!</br>
Entre autre:les cartes de tags, les codes et plein de choses!!!</br></br>Présentement le site est en construction...et il y a uniquement la section Ps2......Mais peut-etre qu'il y aura une section Xbox et Pc.....Qui sait???</p>
<p> Et une seule chose.......ne vous gener surtout pas pour m'écrire sur mon livre d'or!!</p>
</div>
<!-- Le pied de page -->
<div id="pied_de_page">
<h2>Me contacter</h2>
<p>Pour me contacter, <a href="mailto:punk_not_dead_26@hotmail.com">cliquez ici !</a> </p>
<p>Copyright "Antoine Descôteaux" 2005, tous droits réservés</p>
</div>
<style type="text/css">
p
{
color: white;
font-size: 18px;
}
strong
{
text-decoration: underline;
}
body
{
color: white;
background-color: black;
background-image: url(fond.png);
background-repeat: no-repeat; /* Le fond ne se répète pas */
background-position: top right; /* Le fond est aligné en haut à droite */
background-attachment: fixed; /* Le fond est fixé */
text-align: left;
width: 760px;
margin: auto; /* Pour centrer notre page */
margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
margin-bottom: 20px; /* Idem pour le bas du navigateur */
}
a
{
color: blue;
font-size: 18px
}
h1
{
text-align: center; /* Pour center le titre */
color: rgb(0,195,55);
font-family: "Arial Black", Arial, Verdana, serif;
}
h2
{
color: rgb(0,195,55);
}
#en_tete
{
width:758px;
height:100px;
background-image:;
#menu
{
float: left; /* Le menu flottera à gauche */
width: 120px; /* Très important : donner une taille au menu */
}
.element_menu
{
background-color: url("fonddesign.gif") ;
background-image: url(menu_gauche.jpg.jpeg);
background-repeat: repeat;
border: 0px solid black;
margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
margin-right: 20px;
}
.element_menu h3 /* Tous les titres de menus */
{
color: rgb(0,0,0);
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
text-align: center;
}
.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
list-style-image: url("boutons.gif"); /* On change l'apparence des puces */
padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}
.element_menu a /* Tous les liens se trouvant dans un menu */
{
color: white;
}
.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
background-color: black;
color: orange;
}
p
{
color: White;
}
h1
{
color: orange;
}
.important
{
color: white;
font-sixe: 18px;
}
</style>
Pour la seconde méthode, tu dois créer un fichier CSS à l'aide du bloc-note (que tu nommeras avec l'extension .css) et mettre dans la balise <head></head> de ta page XHTML :
La partie chemin_vers_ton_fichier_css.css doit bien sûr être modifiée selon le nom et l'emplacement du fichier CSS que tu as dû créer avec le bloc-note.
Quand tu auras fait tout ça, ça règlera peut-être certains problèmes.
oui je suis au courant merci.. mais j'Ai plutot opté pour un code css interne pour que vous puissiez le visualiser.. mais je comprend très bien le fonctionnement.. mais sa regle toujours pas le probleme...
oui je suis au courant merci.. mais j'Ai plutot opté pour un code css interne pour que vous puissiez le visualiser.. mais je comprend très bien le fonctionnement.. mais sa regle toujours pas le probleme...
Oui mais ton code CSS interne ne se trouve justement pas au bon endroit (d'où le fait que j'ai préféré récaputiler). Il faut mettre d'abord ton code CSS dans la balise <head></head> de ta page. Pour ce qui est du problème, on se penche tous dessus.
Salut, ton code présente beaucoup d'erreur:
ton bloc menu n'est pas fermé, des accolades non fermées dans le css, des balises fermantes et pas ouvrantes, etc....
Je n'ai pas le temps de développer:
Ton code corrigé (vite fait ,je n'ai pas tout regardé):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="fr"> <head> <title>GTA san Andreas!!</title> <metahttp-equiv="Content-Type"content="text/html; charset=iso-8859-1"/>
<styletype="text/css">
p
{
color: white;
font-size: 18px;
}
strong
{
text-decoration: underline;
}
body
{
color: white;
background-color: black;
background-image: url(fond.png);
background-repeat: no-repeat; /* Le fond ne se répète pas */
background-position: top right; /* Le fond est aligné en haut à droite */
background-attachment: fixed; /* Le fond est fixé */
text-align: left;
width: 760px;
margin: auto; /* Pour centrer notre page */
margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
margin-bottom: 20px; /* Idem pour le bas du navigateur */
}
a
{
color: blue;
font-size: 18px
}
h1
{
text-align: center; /* Pour center le titre */
color: rgb(0,195,55);
font-family: "Arial Black", Arial, Verdana, serif;
margin-top: 0px;
}
#menu
{
float: left; /* Le menu flottera à gauche */
width: 150px; /* Très important : donner une taille au menu */
margin-top: 10px;
border: thin solid #FFCC00;
margin-bottom: 20px;
}
#corps h1 {
}
.element_menu h3 /* Tous les titres de menus */
{
color: rgb(0,0,0);
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
text-align: center;
}
.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
list-style-image: url("boutons.gif"); /* On change l'apparence des puces */
padding: 0px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
padding-left: 0px;
margin-left: 20px;
}
.element_menu a /* Tous les liens se trouvant dans un menu */
{
color: white;
}
.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
background-color: black;
color: orange;
}
<divid="corps"> <h1>Bienvenue sur mon site!!</h1> <pclass="important"> Ici, vous pourrez vous renseignez sur plusieurs chose sur le superbe jeu: Gta San Andreas!!!</br>
Entre autre:les cartes de tags, les codes et plein de choses!!!</br></br>Présentement le site est en construction...et il y a uniquement la section Ps2......Mais peut-etre qu'il y aura une section Xbox et Pc.....Qui sait???</p> <p> Et une seule chose.......ne vous gener surtout pas pour m'écrire sur mon livre d'or!!</p>
</div>
<!-- Le pied de page -->
<divid="pied_de_page"> <h2>Me contacter</h2>
<p>Pour me contacter, <ahref="mailto:punk_not_dead_26@hotmail.com">cliquez ici !</a></p> <p>Copyright "Antoine Descôteaux" 2005, tous droits réservés</p> </div>
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
http://www.encheres-cents.com - http://www.checkmycomposer.com