我在VS Code中遇到了Live Server的問題。
當我在我的HTML程式碼中使用導覽列上的Logo時,在沒有使用Live Server的情況下開啟該檔案時,它能正常運作。但是當我嘗試使用Live Server打開它時,它不會顯示。 .
<!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>
這是在沒有使用Live Server的情況下在Chrome中開啟時的輸出結果。
這是使用Live Server開啟時的輸出結果。
在使用Live Server開啟檔案時,我的導覽列中的Logo無法預覽。但是,當我在沒有使用Live Server的情況下開啟該檔案時,它可以正常運作。
P粉2384338622023-07-20 12:56:40
不要在檔案名稱或資料夾之間使用任何空格。
<img src="../World Web/img/Brand/dark logo.svg" alt="logo" width="120" height="60">
要嘛使用dark_logo.svg,要嘛使用dark-logo.svg,World Web也是一樣。