简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Website using Live Server doesn't work when I launch it from a file
P粉530519234
P粉530519234 2024-04-06 12:46:18
0
1
404

I tried several browsers and in every case the website works fine with Live Server. On the other hand, when I launch it using Firefox/Chrome, the site doesn't load my style.css at all, and when I use Edge, I get a message saying the file is missing. Here is my html and css code.

-----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;
}

I've tried renaming the file, changing the position of the lines in the code, rarely using a browser, rarely having similar posts, making different files but don't know what else, but nothing works.

P粉530519234
P粉530519234

reply all(1)
P粉345302753
P粉3453027532024-04-07 10:19:46 1 floor

Try adding it like this../css/style.css

Like +0
Add Reply
Popular Topics
More>
Popular Articles
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！