Sujet Précédent Sujet Suivant

Impossible de lié mon css a mon html

Résolu/Fermé
Serken - Modifié le 14 juin 2019 à 12:38
 Serken - 14 juin 2019 à 13:49
Bonjour,

Je débute dans la création de site web et je me retrouve bloquer car mon fichier css n'arrive pas a se lié au html.
J'ai tenter de le faire marcher sur JSbin pas de soucis, mais sur komodo ou même en le lançant avec chrome pas de css qui s'applique.
Mes docs html et css sont tous dans le même dossier, j'ai déjà essayer de le mettre dans une autre dossier et de changer le chemin mais rien à faire.

Si vous avez des idées ;)
ps: ne prêtez pas attention au couleur utilisés dans mon css elle me permette pour instant de différencier des parties ;)

Ci-joint mon code:

HTML: 

<!DOCTYPE HTML>
<html lang="fr-FR">
<head>
     <title>La Garde De Nuit Eratz 1.29</title>
        <meta charset= "utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0"
        <link href="css/style.css" rel="stylesheet" type="text/css" media="all"/>
</head>
      <!--banniere de la guilde img en tete-->
    <header>
      <img src="https://image.noelshack.com/fichiers/2019/24/4/1560432410-banniere-finale.jpg">
    </header>
        
  <div class="image2">
  <img src="https://i.gyazo.com/700197a261bc8cf5e49b3dda1a4f59d9.jpg">
  </div>
    
         <!--menu principal-->
         
    <nav>   
        
         <div class="table">
             
                <ul>
                     <li class="menu">
                     <a href="accueil1">Accueil</a>
                     </li>
            
                     <li class="menu">
                     <a href="la guilde">La Guilde</a>
                     </li>
            
                     <li class="menu">
                     <a href="le recrutement">Le Recrutement</a>
                     </li>
            
                     <li class="menu">
                     <a href="https://www.dofus.com/fr/forum/1580-1-29-eratz-henual">Forum 1.29</a>
                     </li>
            
                     <li class="menu">
                     <a href="http://www.dofus.tools/">Dofus Tools</a>
                     </li>
            
                     <li class="menu">
                     <a href="http://lagardenuitdof.forum-jeu.com/">Notre Forum</a>
                     </li>
                </ul>
         </div>
        
    </nav>
    
              <br>
              <br>
              <br>
              <br><br>
              <br><br>
              <br><br>
              <br><br>
              
              <br><br>
              <br><br>
              <br><br>
              <br>

  <div class="table2">
             
                <ul>
                     <li class="menu2">
                     <a href="https://barbok.eratz.fr/index.php/accpano">Panoplies</a>
                     </li>
            
                     <li class="menu2">
                     <a href="https://barbok.eratz.fr/index.php/equipements/amulettes">Les Stuffs</a>
                     </li>
            
                     <li class="menu2">
                     <a href="le recrutement">Le Recrutement</a>
                     </li>
            
                     <li class="menu2">
                     <a href="https://www.dofus.com/fr/forum/1580-1-29-eratz-henual">Forum 1.29</a>
                     </li>
            
                     <li class="menu2">
                     <a href="http://www.dofus.tools/">Dofus Tools</a>
                     </li>
            
                     <li class="menu2">
                     <a href="http://lagardenuitdof.forum-jeu.com/">Notre Forum</a>
                     </li>
                </ul>
         </div>
    
    <footer>
      
        <p>Dofus est un MMORPG édité par Ankama."Barbok " est un site non-officiel sans aucun lien avec Ankama."LaGardeDeNuit "
           est un site non-officiel sans aucun lien avec Ankama.
           Toutes les illustrations sont la propriété d'Ankama Studio et de Dofus.</p>
    
    </footer>
 
</body>
</html>


CSS: 

body{

        font-family:'Century Gothic', Calibri, Serif;
        font-size:14px;
        margin:0px;
        padding:0px;
        background-color:#1e457c;
}

header{
    width:100%;
}

footer{
       height:1px;
       padding-top:0px;
       text-align:center;      
       border-top:2px solid #AAA;

}

nav{
       width:100%;
       background-color:#098BBF;
       
       
}
nav ul{
        margin:0px;
        padding:0px;
       
}

nav li{
       list-style-type:none;
       float:left;
       
}

nav a{
       display:inline-block;
       text-decoration:none;
       padding:20px 30px;
       color:red;
       text-transform:uppercase;
       font-size:15px;
       
       
}

table{
       display:table;
       margin: 0 auto;
       
       
}
           /* onglet menu*/

.menu-ind:hover{
  
  background-color:yellow;
  border-top:5px solid red;
}

.menu-exp:hover{
  border-top: 5px solid green;
  background-color: blue;
  
  
}

.menu-hob:hover{
  
  border-top:5px solid black;
  background-color:pink;
}


.menu-con:hover{
      border-top:5px solid black;
      background-color: pink;
  
}
A voir également:

4 réponses

Réponse 1 / 4
Utilisateur anonyme
Modifié le 14 juin 2019 à 12:34
bonjour,
et si tu mettait le css dans la feuille HTML ?
avec la balise </style>
comme sur la capture d'ecran:

a+
0
Serken
14 juin 2019 à 13:27
Bonjour,

J'ai lu sur pas mal de site qu'il était conseillé de séparer le css du html pour éviter les erreurs c’est pour cela que je souhaite qu'il soit dans deux fichiers distinct.

Le plus bizarre c'est que sur js bin pas de soucis tout marche. Pourtant le link est bien noté (j'ai vérifier 3 fois de pas avoir fait de fautes).
0
Réponse 2 / 4
jee pee Messages postés 40470 Date d'inscription mercredi 2 mai 2007 Statut Modérateur Dernière intervention 23 novembre 2024 9 427
Modifié le 14 juin 2019 à 12:39
Salut,

Il manque la balise <body>

0
Serken
14 juin 2019 à 13:24
Bonjour, il y a bien une balise body, juste une erreur dans le copier coller du post
0
Réponse 3 / 4
1Seb Messages postés 166 Date d'inscription dimanche 27 mars 2016 Statut Membre Dernière intervention 30 octobre 2021 37
Modifié le 14 juin 2019 à 13:37
Bonjour,

Essaie également en fermant la balise meta avec > , comme ceci :
<meta name="viewport" content="width=device-width, initial-scale=1.0">

0
Réponse 4 / 4
Serken
14 juin 2019 à 13:49
Allélouyaaaaaaa sa marchais pas a cause de la meta pas fermer x), merci à tous les amis
0

Discussions similaires

la balise <br> ou <br />
faamugol -
rwaness -

8 réponses
<br> ou <br /> ou </br>
corentin.93 -
jessy006 -

11 réponses
Espace en HTML
baissaoui -
baissaoui -

0 réponse
Que veut dire <p>&nbsp;</p>?
quinn mallory -
prosthetiks -

3 réponses
trait horizontal avec du css
tipi75 -
tipi75 -

8 réponses