Pas de lien CSS/html

Fermé

Martin - Modifié le 9 juin 2021 à 18:26
Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021 - 9 juin 2021 à 22:04

Bonjour,

J'essaie de créer un site web, je code sur Komodo (sur Mac), le lien ne se fais pas entre mon CSS et mon HTML, pourtant dans le même dossier.

Voici mon code HTML :

<!DOCTYPE html>
<html>
  <head>
  <Meta charset="utf-8">
<Link rel="stylesheet" href="style.css"/>
  </head>
  <div><nav><a href="#Les Transferts";>Les Transferts</a> |
    <a href="#Calendrier";>Calendrier</a> |
    <a href="#Effectif";>Effectif</a> |
    <a href="#News";>News</a>
    </nav>
  </div>
  <br>
  <hr>
  <h3 class="text-align:center; font-family:Verdana";><U>L'actualité en Live</U></h3>
  <h4>Ligue 1 - Fin de saison</h4>
  <article>
    <p>Le PSG termine deuxième à un seul petit point de Lille, champion de France. La lutte aura été belle, quatre équipes s'affrontant pour deux places en <em>Ligue des Champions</em>. A force d'être inconstant, <a style="text-decoration: line-through; text-decoration-color:blue";>Lyon</a> est le grand perdant de cette compétition</p>
  </article>
  <div><nav>
  <a href="#Lire la suite";>Lire la suite</a>
    </nav>
  </div>
  <br>
 <hr>
  <p style="font-family:comic sans ms";>Il est grand temps à notre équipe de faire un tri au niveau de son effectif, se son staff et de voir quels postes renforcer.</p>
  <br>
  <table class="margin";>
  <caption>Tableau récapitulatif
    </caption>
    <tr>
      <th>Nom</th>
      <th>Prix</th>
      <th>Efficacité</th>
      <th>Note</th>
    </tr>
    <tr>
      <td>Kehrer</td>
      <td>15M</td>
      <td>3/10</td>
      <td><strong>3/10</strong></td>
    </tr>
    <tr>
      <td>Florenzi</td>
      <td>Prêt</td>
      <td>6/10</td>
      <td><strong>6/10</strong></td>
    </tr>
    <tr>
      <td>Icardi</td>
      <td>50M</td>
      <td>5/10</td>
      <td><strong>5/10</strong></td>
    </tr>
  </table>
  <br>
  <hr>
  <br>
  <p class="titre";>Dimanche 06 Juin</p>
  <p><span class="rouge";><strong>20h22</strong></span><strong> - Wijnaldum</strong></p>
  <p> Le joueur sous contrat jusqu'à 30 juin avec Liverpool était en passe de rejoindre son compatriote néerlandais <em>Memphis Depay</em> au FC Barcelone. C'était sans compter l'offre alléchante proposée par le PSG, qui compte bien double le club catalan. Affaire a suivre.</p>
  <br>
  <p><span class="rouge"> <strong>10h12</strong></span><strong> - Hakimi</strong></p>
  <p>Le PSG n'a toujours pas fait d'offre pour <em>Hachraf Hakimi</em> bien que le joueur soit tombé d'accord pour un contrat de 5 ans. La somme proposée ne satisfait pas les dirigeants interistes.</p>
<br>
<p class="overflow";> J'aimerai à titre personnel vous faire part de mon enthousiasme. Le recrutement me paraît être bon et les joueurs ciblés vraiment impliqués, malgré quelques uns plus très jeunes. Leonardo fait quand même un bon travail de chasse aux "bonnes affaires".</p>
</Body>
</HTML>

Voici mon CSS :

font-weight:lighter;
      font-family:"comic sans ms";
      font-variant:small caps;
      text-shadow:1px 1px 2px black;
      }
      p{
      text-align:justify;
      line-height:20px;
      }
      .margin{
      margin: 0 auto 0 auto;
      border-style: dashed;
      border-width: 5px;
      border-color: blue red green orange;
      border-radius: 5px;
      }

Est ce un problème dans mon code ou dans le chemin d'accès au fichier ?

Merci a tous ! ✌️

EDIT : Ajout des balises de code

A voir également:

Pas de lien CSS/html
Lien url - Guide
Créer un lien pour partager des photos - Guide
Verificateur de lien - Guide
Editeur html - Télécharger - HTML
Br html ✓ - Forum Webmastering

4 réponses

Réponse 1 / 4

jordane45 Messages postés 38459 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 3 avril 2025 4 740
9 juin 2021 à 18:27

Bonjour,

Déjà, pour poster du code sur le forum, merci d'utiliser les balises de code.
Explications à lire ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

Ensuite, tu as oublié la balise ouvrant <body>

Et enfin, une fois corrigé .. pense à vider le cache de ton navigateur;

Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021
Modifié le 9 juin 2021 à 18:53

Merci beaucoup, désolé je n'avais pas vu. Même en ajoutant les balises manquantes et vidé le cache, ça ne change rien. Pourtant, quand je prends un lien qu'on m'envoie et que je le copie dans mon éditeur, cela fonctionne et le CSS s'applique au HTML. Quand c'est moi qui le créé non.

Cf: une photo, le fichier HTML paraît normal ? ?

Merci @Jordane.

jordane45 Messages postés 38459 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 3 avril 2025 4 740 > Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021
9 juin 2021 à 19:20

Visiblement tu as un dossier style et ton fichier CSS où se trouve pas dans le même dossier que ta page HTML..
Il faut donc spécifier le chemin jusqu'à ton fichier

Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021 > jordane45 Messages postés 38459 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 3 avril 2025
9 juin 2021 à 19:31

Mon fichier style.css se trouve dans le dossier styles, j'ai donc essayé comme suit :

<link rel="stylesheet" href="styles/style.css>

Ou encore :

<link rel="stylesheet" href="..styles/style.css>

Dans les deux cas le CSS ne s'applique pas, ni dans l'éditeur de code ni dans Google Chrome et Safari.

Le problème peut il être le Mac ? Bizarre je ne vois pas ce que ça peut être...

Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021 > Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021
Modifié le 9 juin 2021 à 20:54

Voilà deux images qui peuvent peut être vous aider

Réponse 2 / 4

Jean20B Messages postés 1817 Date d'inscription dimanche 6 avril 2014 Statut Membre Dernière intervention 23 mars 2025 2 330
Modifié le 9 juin 2021 à 21:11

Bonjour, les 5 premières lignes du CSS me laissent penser qu'il manque quelque chose qui devrait se trouver au-dessus, mais je ne sais pas ce que vous voulez mettre.

body {

Peut-être ?

Il y a un } à la 5ème ligne qui ne ferme rien.

Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021
9 juin 2021 à 21:18

Bonjour Jean,

En fait c'est caché mais c'est le H4 qui concerne cette partie. J'ai vérifié mon code tout a l'air bon...

Si je copie colle mon code dans un éditeur le CSS s'affiche bien. Mais quand je pars de 0 pour refaire une page HTML et associer un CSS ça ne s'affiche pas..

Jean20B Messages postés 1817 Date d'inscription dimanche 6 avril 2014 Statut Membre Dernière intervention 23 mars 2025 2 330 > Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021
Modifié le 9 juin 2021 à 21:33

Je viens de voir quelque chose d'étrange dans votre photo, il y a différents types de guillemets dans l'HTML, je pense que tous les guillemets jusqu'à la ligne 5 doivent être changés.

Réponse 3 / 4

Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021
9 juin 2021 à 21:28

Ah bon ? Moi je ne vois qu'une sorte de guillemet qui est celle là : ""

C'est de ceux là dont tu parles ?

Jean20B Messages postés 1817 Date d'inscription dimanche 6 avril 2014 Statut Membre Dernière intervention 23 mars 2025 2 330
Modifié le 9 juin 2021 à 21:34

Il y a des guillemets un peu plus courbés (guillemets anglais je crois) : ””
Je ne suis pas sûr qu'ils fonctionnent en HTML.

Réponse 4 / 4

Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021
9 juin 2021 à 21:37

Mais ma page HTML ne s'afficherait pas dans ces cas là je pense, alors que mon HTML est bon, c'est juste mon CSS qui ne s'applique pas dans la page.

Jean20B Messages postés 1817 Date d'inscription dimanche 6 avril 2014 Statut Membre Dernière intervention 23 mars 2025 2 330
Modifié le 9 juin 2021 à 21:42

La page peut quand même s'afficher, mais sans le lang="fr", le <meta charset="UTF-8">, et le <link> qui contient le lien vers le CSS.
On peut même voir sur la photo que les accents ne s'affichent pas correctement car l'encodage UTF-8 ne s'est pas appliqué à la page (à cause des guillemets qui cassent le code).

Martin9377 Messages postés 8 Date d'inscription mercredi 9 juin 2021 Statut Membre Dernière intervention 9 juin 2021 > Jean20B Messages postés 1817 Date d'inscription dimanche 6 avril 2014 Statut Membre Dernière intervention 23 mars 2025
9 juin 2021 à 22:04

D'accord merci Jean je vais essayer ça demain elle, mais j'ai bien peur que sur Mac il n'y ait que ce type de guillemets..
Les guillemet droits, donc les bons, provenaient de mon téléphone.

Discussions similaires

Rajout de lien sur plusieurs pages

lien copié

comment utiliser un lien MEGA pour télécharger un fichier ?

Faux virus (Pour une blague)

Impossible d'ouvrir des liens via mon Samsung A71