Menu

Faire un menu horizontale

romain444444 11 Messages postés mercredi 11 avril 2018Date d'inscription 15 avril 2018 Dernière intervention - 11 avril 2018 à 02:52 - Dernière réponse : animostab 2845 Messages postés jeudi 10 mars 2005Date d'inscription 20 avril 2018 Dernière intervention
- 12 avril 2018 à 22:00
Bonjour, je suis débutant dans le domaine, je souhaiterai faire un menu horizontale sur mon site, mais je n'y arrive pas même après plusieurs heure de recherche sur le web et de nombreuse tentative.

Pourriez vous m'aider ?

Voici mon script:

"<!DOCTYPE HTML>

<html lang=fr>
<head>
<meta charset=utf-8/>
<link rel="stylesheet" href="style.css" />
<title>Escalade aventure</title>
<center><img src="https://4.bp.blogspot.com/-1gCZ_dWlZWY/VPxO0w1eygI/AAAAAAAACqE/fYakcxRkf1U/s1250/cooltext115245995745692.jpg" alt="Logo escalade aventure"></center>

</head>

<body>

<nav>
<ul id="Menu_horizontale">
<li><a href=accueil.php>Accueil</a></li>
<li><a href=produit.php>Produit</a></li>
<li><a href=contact.php>Contact</a></li>
</ul>
</nav>

ul#menu_horizontal li {
display : inline;
padding : 0 0.5em;
}
ul#menu_horizontal {
list-style-type : none;
}


<body style="background-color:#32CD32;"></body>"
Afficher la suite 

Votre réponse

5 réponses

1Seb 116 Messages postés dimanche 27 mars 2016Date d'inscription 8 juillet 2018 Dernière intervention - Modifié par 1Seb le 11/04/2018 à 08:35
0
Merci
Bonjour,

Ça serait plus quelque chose dans ce genre là

HTML :

<!DOCTYPE html>
<html lang=fr>

<head>
<meta charset="utf-8"/>
<title>Escalade aventure</title>
<link rel="stylesheet" type="text/css" href="style.css"> 
</head>

<body>

<div id="logo-header">
  <img src="https://4.bp.blogspot.com/-1gCZ_dWlZWY/VPxO0w1eygI/AAAAAAAACqE/fYakcxRkf1U/s1250/cooltext115245995745692.jpg" alt="Logo escalade aventure"/>
</div>

<ul>
  <li><a href=accueil.php>Accueil</a></li> 
  <li><a href=produit.php>Produit</a></li> 
  <li><a href=contact.php>Contact</a></li>
</ul>

</body>
</html>


CSS :

body {
    background-color : #32CD32;
}
div#logo-header {
    text-align: center;
}
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}
li {
    float: left;
}
li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}
li a:hover {
    background-color: #111;
}

romain444444 11 Messages postés mercredi 11 avril 2018Date d'inscription 15 avril 2018 Dernière intervention - 11 avril 2018 à 15:07
Merci pour ta réponse, en copiant/collant, ça ne fonctionne pas, comme si le site ne reconnaissait pas cette écriture, elle s'affiche en texte sur ma page.
1Seb 116 Messages postés dimanche 27 mars 2016Date d'inscription 8 juillet 2018 Dernière intervention - 11 avril 2018 à 17:26
Et ceci ?

<!DOCTYPE html>
<html lang=fr>
<head>
<meta charset="utf-8"/>
<title>Escalade aventure</title> 
<style>

div#logo-header {
    text-align: center;
}
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover {
    background-color: #111;
}

body {
    background-color : #32CD32;
}
</style>
</head>
<body>

<div id="logo-header">
  <img src="https://4.bp.blogspot.com/-1gCZ_dWlZWY/VPxO0w1eygI/AAAAAAAACqE/fYakcxRkf1U/s1250/cooltext115245995745692.jpg" alt="Logo escalade aventure"/>
</div>

<ul>
  <li><a href=accueil.php>Accueil</a></li> 
  <li><a href=produit.php>Produit</a></li> 
  <li><a href=contact.php>Contact</a></li>
</ul>

</body>
</html>
romain444444 11 Messages postés mercredi 11 avril 2018Date d'inscription 15 avril 2018 Dernière intervention - 11 avril 2018 à 23:43
ça marche !! je te remercie !!!

Qu'est ce que tu as changé ?
animostab 2845 Messages postés jeudi 10 mars 2005Date d'inscription 20 avril 2018 Dernière intervention - 12 avril 2018 à 22:00
Bonjour
au lieu d'utiliser la balise <style> dans la page essaie d'apprendre a utiliser le css (le style) dans un fichier externe et de l'importer grace à la balise link dans le head plus d'infos ici sur le css https://www.cssdebutant.com/debuter-en-css-integrer-du-css-page-HTML.html
Commenter la réponse de 1Seb