Problème code CSS / XHTML

Résolu/Fermé

Lilie - 16 juil. 2008 à 19:10
Lilie - 16 juil. 2008 à 19:40

Bonjour,
Je me suis mise récemment à apprendre les bases du xhtml et du css afin de pouvoir créer un
site. Hélas, j'ai besoin d'aide dans mon projet.

Sur ma page, j'aimerais que les liens ( textes, bric à brac etc.. ) soient des menus de haut afin
d'obtenir des liens relatifs. Le soucis, c'est que je ne sais pas comment le coder pour obtenir
quelque chose comme :

Textes Albums photos Quotes Bric à brac Pour en savoir + Me contacter

Voici ma page de test :

<html>
<head>
<meta http-equiv="content-type"
content="text/html; charset=ISO-8859-1">
<title> Page 1</title>
<style>
#moncadre {
width:800px;
margin:auto;
padding:10px;
background-color:#FFFFFF;
border-left:1px solid #000000;
border-right:1px solid #000000;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
}

body {
background-color: #FFFFFF;
color: #000000;
margin: 50px;
font-family: " Bookman old style ", " Comic sans ms "," Franklin Gothic Medium " , " Zapf Chancery ";
font-size: x-large;
line-height: 160%;
margin-right: 50px;
}

</style>
</head>
<body>

<div id="moncadre"><p> <a href="cible.html">Textes</a> </p>
<p> <a href="cible.html"> Album photos </a> </p>
<p> <a href="cible.html"> Quotes </a> </p>
<p> <a href="cible.html"> Bric à brac </a> </p>
<p> <a href="cible.html"> Pour en savoir + </a> </p>
<p> <a href="mailto:..."> Me contacter </a> </p>

</div>
</body>
</html>

Merci d'avance de votre aide.

A voir également:

Problème code CSS / XHTML
Code asci - Guide
Code puk bloqué - Guide
Code telephone oublié - Guide
Code blocks free - Télécharger - Langages
Code windows 10 - Guide

5 réponses

Réponse 1 / 5

zogo Messages postés 114 Date d'inscription samedi 30 juin 2007 Statut Membre Dernière intervention 29 mai 2009 5
16 juil. 2008 à 19:19

Voici un exemple plus concret :

<style type="text/css">
#topMenu {width: 205px; height: 23px; margin:7px auto 0 auto; padding-top:12px; padding-left: 700px; background-image:url( !! chemin vers ton image.... !!);}
#topMenu ul {margin: 0; padding:0; list-style:none;}
#topMenu li  {display:inline; border-left: #a0a0a0 solid 1px; padding-left: 5px; padding-right:5px;}
#topMenu li a:link { text-decoration: none; color:#95ccff;}
#topMenu li a:visited { text-decoration: none; color:#95ccff;}
#topMenu li a:hover { text-decoration: underline; color:#fff;}
</style>

et en (x)HTML :

<div id="topMenu">
<ul><li>Mes liens</li><li>Mon album photo</li></ul>
</div>

Oublie pas de remplacer "!! chemin vers ton image.... !!" par un chemin vers une image du style http://www.google.com/image.jpg ou "./images/mesimages/monimage.gif".

Réponse 2 / 5

zogo Messages postés 114 Date d'inscription samedi 30 juin 2007 Statut Membre Dernière intervention 29 mai 2009 5
16 juil. 2008 à 19:16

Salut !

Si tu veux plusieurs conseil :
1) Ne met pas tes liens comme ca, fait sous forme de puce :

<ul><li>Lien 1</li><li>Lien 2</li></ul>

2) remplace

<style>

par

<style type="text/css">

, et surtout rajoute une DTD sinon tu va avoir quelques problèmes .

Ton problème repose sur le fit que tu met "<p>" à chaque fois, une balise de paragraphe, essaye avec mon code de ul et li et tu verra ca marchera.

Réponse 3 / 5

Lilie
16 juil. 2008 à 19:36

Effectivement ça marche.

Merci beaucoup pour ta réponse rapide et efficace.

Merci pour les autres conseils aussi, ils sont les bienvenus ^^

Réponse 4 / 5

zogo Messages postés 114 Date d'inscription samedi 30 juin 2007 Statut Membre Dernière intervention 29 mai 2009 5
16 juil. 2008 à 19:38

Tiens si jamais tu sais pas ce que c'est que la DTD ou que tu veux choisir laquel mettre :

http://css.alsacreations.com/Bases-et-indispensables/DTD-comment-choisir

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

Posez votre question

Réponse 5 / 5

Lilie
16 juil. 2008 à 19:40

Merci, j'en cherchais justement une lol

Discussions similaires

Code de renvoi d'appel : Ooredo, Mobilis...

Acces à snapchat temporairement désactivé

Code Free Wifi Secure : comment en récupérer

Erreur 80072EFE windows update

Discussions similaires

Newsletters