J'ai essayé plusieurs navigateurs et dans tous les cas, le site Web fonctionne bien avec Live Server. En revanche, lorsque je le lance avec Firefox/Chrome, le site ne charge pas du tout mon style.css, et lorsque j'utilise Edge, je reçois un message indiquant que le fichier est manquant. Voici mon code html et css.
-----index.html-----
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" href="/css/style.css" /> <link rel="stylesheet" href="/bootstrap/bootstrap-5.3.0-alpha1-dist/css/bootstrap.css" /> <link rel="stylesheet" href="/bootstrap/bootstrap-5.3.0-alpha1-dist/css/bootstrap.min.css" /> <title>Web Projekat</title> </head> <body> <nav class="navbackgroundcolor navbar navbar-expand-lg navbar-dark"> <!-- Container wrapper --> <div class="container-fluid"> <!-- Toggle button --> <button class="navbar-toggler" type="button" data-mdb-toggle="collapse" data-mdb-target="#navbarCenteredExample" aria-controls="navbarCenteredExample" aria-expanded="false" aria-label="Toggle navigation" > <i class="fas fa-bars"></i> </button> <!-- Collapsible wrapper --> <div class="collapse navbar-collapse justify-content-center" id="navbarCenteredExample" > <!-- Left links --> <ul class="navbar-nav mb-2 mb-lg-0"> <li class="nav-item pe-5 fs-4"> <a class="nav-link" href="/html/gallery.html">Gallery</a> </li> <li class="nav-item"> <a class="nav-link active" aria-current="page" href="index.html" ><img class="skate" src="/media/icons8-skateboard-64 white.png" alt="Home" /></a> </li> <li class="nav-item ps-5 fs-4"> <a class="nav-link" href="/html/shop.html">Shop</a> </li> </ul> <!-- Left links --> </div> <!-- Collapsible wrapper --> </div> <!-- Container wrapper --> </nav> <script src="/bootstrap/bootstrap-5.3.0-alpha1-dist/js/bootstrap.js"></script> <script src="/bootstrap/bootstrap-5.3.0-alpha1-dist/js/bootstrap.min.js"></script> </body> </html>
-----style.css-----
.skate { height: 35px; width: 35px; } .navbackgroundcolor { background-color: #464648; } .navbar-link { color: #c7c7c7 !important; } body { background-size: cover; background-color: #392727 !important; }
J'ai essayé de renommer le fichier, de changer la position des lignes dans le code, d'utiliser quelques navigateurs, d'avoir quelques publications similaires, de créer des fichiers différents mais je ne sais pas quoi d'autre, mais rien ne fonctionne.
Essayez de l'ajouter comme ceci ../css/style.css