cari

Rumah  >  Soal Jawab  >  teks badan

Mengapa imej tidak dipaparkan dalam VS Code Live Server?

Saya mempunyai masalah dengan Pelayan Langsung dalam Kod VS.

Apabila saya menggunakan logo pada bar navigasi dalam kod HTML saya, ia berfungsi dengan baik apabila membuka fail tanpa menggunakan Pelayan Langsung. Tetapi apabila saya cuba membukanya menggunakan Pelayan Langsung, ia tidak muncul. .

  1. Ini kod HTML saya
<!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" />
    <title>World Web</title>
    <link rel="stylesheet" href="css/style.css" />
    <!--Boostrap Linked-->
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65"
      crossorigin="anonymous"
    />
  </head>
  <body>
    <!--Nav Bar section Start-->
    <div>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark container">
      <a class="navbar-brand" href="">
        <img src="../World Web/img/Brand/dark logo.svg" alt="logo" width="120" height="60">
      </a>
        <button
          class="navbar-toggler"
          type="button"
          data-bs-toggle="collapse"
          data-bs-target="#navbarSupportedContent"
          aria-controls="navbarSupportedContent"
          aria-expanded="false"
          aria-label="Toggle navigation"
        >
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
            <li class="nav-item">
              <a class="nav-link active" href="#">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">About</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Services</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Contact us</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Download</a>
            </li>
            
            
          </ul>

        </div>
    </nav>
  </div>
    <!--Nav Bar section End-->

    <!--Hero section Start-->

    <!--Hero section End-->

    <!--AboutUs section Start-->

    <!--About us section End-->

    <!--Footer section Start-->

    <!--Footer section End-->

    <!--Java Script-->
    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4"
      crossorigin="anonymous"
    ></script>
  </body>
</html>

  1. Ini ialah output apabila dibuka dalam Chrome tanpa menggunakan Pelayan Langsung.

  2. Ini adalah output apabila dibuka menggunakan Pelayan Langsung.

Apabila membuka fail menggunakan Pelayan Langsung, logo dalam bar navigasi saya tidak boleh dipratonton. Walau bagaimanapun, apabila saya membuka fail tanpa menggunakan Pelayan Langsung, ia berfungsi dengan baik.

P粉710454910P粉710454910483 hari yang lalu479

membalas semua(1)saya akan balas

  • P粉238433862

    P粉2384338622023-07-20 12:56:40

    Jangan gunakan sebarang ruang antara nama fail atau folder. 

    <img src="../World Web/img/Brand/dark logo.svg" alt="logo" width="120" height="60">

    Sama ada gunakan dark_logo.svg atau dark-logo.svg, perkara yang sama berlaku untuk World Web.

    balas
    0
  • Batalbalas