導航欄中的自舉圖片

-1

我有一張圖片想要用來代替彩色背景。導航欄中的自舉圖片

但由於某種原因，它只是給我一個普通的白色背景。

我似乎無法找到錯誤，但我仍然會嘗試。我希望有人可以幫助我解決這個問題，因爲我還在學習HTML，CSS & PHP！

CODE：

<?php 
 
// CSS Fil: 
 

 

 

 

 

 
?> 
 
<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 

 
<!-- Optional theme --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 
 

 
<!-- Jquery css --> 
 
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 
 

 
<!-- Fontawesome.io CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
 

 
<style> 
 
\t html { 
 
\t position: relative; 
 
\t min-height: 100%; 
 
\t } 
 
\t body { 
 
\t /* Margin bottom by footer height */ 
 
\t margin-bottom: 60px; 
 
\t } 
 
\t .footer { 
 
\t position: absolute; 
 
\t bottom: 0; 
 
\t width: 100%; 
 
\t /* Set the fixed height of the footer here */ 
 
\t height: 60px; 
 
\t background-color: #f5f5f5; 
 
\t } 
 
\t 
 

 
\t 
 
\t body { 
 
    background-image: url("images/vortrex-bg.png"); 
 
    background-size: cover; 
 
    background-attachment: fixed; 
 
\t } 
 
\t 
 
\t .footer { 
 
\t \t background: none; 
 
     padding: 20px; 
 
\t } 
 
\t .footer-p { 
 
\t \t color: black; 
 
\t \t 
 
\t } 
 
\t .footer-link { 
 
\t \t color: red; 
 
\t } 
 
\t .footer-link:hover { 
 
\t \t text-decoration: none; 
 
\t \t color: darkred; 
 
\t } 
 
\t .navbar-default { 
 
\t \t background-image: url(../images/128-198.png); 
 
     border-radius: 10px; 
 
     border: solid; 
 
\t } 
 
\t .navbar-default .navbar-nav > li > a { 
 
\t \t color: black; 
 
\t \t text-align: center; 
 
\t } 
 
\t 
 
\t .navbar-default .navbar-nav > li > a:hover { 
 
    color: darkgrey; 
 
\t } 
 
\t 
 
\t .navbar-default .navbar-nav > li > a:focus { 
 
\t color: none; 
 
\t } 
 
\t 
 
\t .navbar-default .navbar-nav .active > a, 
 
\t .navbar-default .navbar-nav .active > a:hover { 
 
\t \t color: black; 
 
\t \t background: darkgrey !important; 
 
\t } 
 
\t .img-circle { 
 
\t margin: -7px; 
 
\t } \t \t 
 
    .side-box-right { 
 
     margin: 10px; 
 
     padding: 10px; 
 
     margin-top: 100px; 
 
     float: right; 
 
     border: solid; 
 
     border-color: black; 
 
     border-radius: 10px; 
 
     background-image: url(../images/128-198.jpg); 
 
     
 
    } 
 
    .side-box-left { 
 
     margin: 10px; 
 
     padding: 10px; 
 
     margin-top: 100px; 
 
     float: right; 
 
     border: solid; 
 
     border-color: black; 
 
     border-radius: 10px; 
 
     background: darkgrey; 
 
    } 
 
    .nyheder { 
 
     border: solid; 
 
     background: darkgrey; 
 
     border-radius: 10px; 
 
    } 
 

 
</style>

<?php include('config/setup.php'); ?> 
 
<!DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
\t \t <meta charset="UTF-8"> 
 
\t \t <?php include('config/css.php'); ?> 
 
\t \t <?php include('config/js.php'); ?> 
 
\t \t 
 
\t \t <title>Home | Vortrex</title> 
 
\t \t \t 
 
\t </head> 
 
\t <body> 
 
\t \t <div class="container"> 
 
     <div class="row"> 
 
\t \t \t <div class="col-md-2"> 
 
\t \t \t \t <div class="side-box-left"> 
 
\t \t \t \t \t Teamspeak3 Class 
 
\t \t \t \t <?php 
 
\t \t \t \t /* \t try 
 
\t \t \t \t \t { 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t // show server as online 
 
\t \t \t \t \t echo "Server Status: online<br />\n"; 
 
\t \t \t \t \t echo "Server IP: " . $ts3->getAdapterHost() . ":" . $ts3->virtualserver_port . "<br />\n"; 
 
\t \t \t \t \t echo "Server Name: " . $ts3->virtualserver_name . "<br />\n"; 
 
\t \t \t \t \t echo "Server Uptime: " . TeamSpeak3_Helper_Convert::seconds($ts3->virtualserver_uptime) . "<br />\n"; 
 
\t \t \t \t \t echo "Server Version: " . TeamSpeak3_Helper_Convert::version($ts3->virtualserver_version) . "<br />\n"; 
 
\t \t \t \t \t echo "Current Clients: " . $ts3->virtualserver_clientsonline . "/" . $ts3->virtualserver_maxclients . "<br />\n"; 
 
\t \t \t \t \t } 
 
\t \t \t \t \t catch(Exception $e) 
 
\t \t \t \t \t { 
 
\t \t \t \t \t // grab errors and show server as offline 
 
\t \t \t \t \t echo "Server Status: offline<br />\n"; 
 
\t \t \t \t \t } */ 
 
\t \t \t \t ?> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t <!-- RIGHT HERE --> \t 
 
      <div class="col-md-8"> \t 
 
\t \t \t \t <nav class="navbar navbar-default" role="navigation"> 
 
\t \t \t \t \t <ul class="nav navbar-nav"> 
 
\t \t \t \t \t \t <div class="navbar-header"><a class="navbar-brand" href="#"><img class="img-circle" alt="Brand" src="images/logo.png" height="32" width="32"></a></div> 
 
\t \t \t \t \t \t <li class="active"><a href="index.php">Home</a></li> 
 
\t \t \t \t \t \t <li><a href="statistik.php">Statistikker</a></li> 
 
\t \t \t \t \t \t <li><a href="/forum">Forum</a></li> 
 
\t \t \t \t \t \t <li><a href="#">Kontakt</a></li> 
 
         <li><a href="shop.php">Shop</a></li> 
 
         <li><a href="bans/index.php">Ban List</a></li> 
 
\t \t \t \t \t </ul> 
 
\t \t \t \t </nav><!-- Slutningen af navbaren --> 
 
\t \t \t \t \t 
 
\t \t \t \t <div class="nyheder"> 
 
\t \t \t \t \t 
 
\t \t \t \t \t <!-- Overskrift på forsiden! --> 
 
\t \t \t \t \t 
 
\t \t \t \t \t <h1 align="center">Velkommen til Vortrex</h1> 
 
\t \t \t \t \t 
 
\t \t \t \t \t <!-- Overskrift på forsiden! --> 
 
\t \t \t \t \t 
 
\t \t \t \t \t <!-- I mellen <p> og </p> skrives hvad der skal stå på forsiden! --> 
 
\t \t \t \t \t <br> 
 
\t \t \t \t \t <br> 
 
\t \t \t \t \t <h3 align="center">Nyheder</h1> 
 
\t \t \t \t \t <p align="center"> 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t \t <?php #SKRIV HERUNDER! ?> 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t 
 
         
 
         
 
\t \t \t \t \t \t <?php #SKRIV HEROVER! ?> 
 
\t \t \t \t \t </p> 
 
\t \t \t \t \t <!-- I mellen <p> og </p> skrives hvad der skal stå på forsiden! --> 
 
\t \t \t 
 
       </div> 
 
\t \t \t \t \t \t 
 
\t \t </div> 
 
\t \t <div class="col-md-2"> 
 
\t \t \t <div class="side-box-right"> 
 
\t \t \t <?php 
 
\t \t \t 
 
\t \t \t $q = "SELECT * FROM server"; 
 
\t \t \t $r = mysqli_query($dbc, $q); 
 
\t \t \t \t 
 
\t \t \t \t if($r) { 
 
\t \t \t \t \t 
 
\t \t \t \t 
 
\t \t \t \t \t while ($rows = mysqli_fetch_assoc($r)) { 
 
\t \t \t \t \t 
 
\t \t \t \t \t $online = $rows['online']; 
 
\t \t \t \t \t $status = $rows['status']; 
 
\t \t \t \t \t  
 
         
 
\t \t \t \t \t \t if($status == "Online") { 
 
          echo "<h3 align='center'><font color='green'>$status</font><br>$online/200</h3>"; 
 
          echo "<h4><strong>mc.vortrex.dk</strong></h4>"; 
 
          } else { 
 
          echo "<h3 align='center'><font color='red'>$status</font></h3>"; 
 
          echo "<h4><strong>mc.vortrex.dk</strong></h4>"; 
 
          } 
 
         } 
 
         } else { 
 
         echo "<h2>Der skette en fejl der gjorde serverens status ikke kunne vises!</h2>"; 
 
         echo "<br>"; 
 
         echo "<h4>Kontakt et staff medlem!"; 
 

 
         } 
 

 
         ?> 
 

 
\t \t \t </div> 
 
\t \t </div> \t 
 
</div> \t 
 
</div> 
 
\t \t \t \t 
 
\t \t \t \t <?php include(D_TEMPLATE.'/footer.php'); ?> \t 
 
\t \t \t \t 
 
\t \t \t \t <!--<div id="console-debug"> 
 
\t \t \t \t \t Test debug window 
 
\t \t \t \t </div>--> 
 

 
\t </body> 
 
</html>

謝謝您的時間和幫助！

來源

2016-04-29 Nichlas Mortensen

你在你的代碼的圖像文件夾2條不同的路徑

body { 
    background-image: url("images/vortrex-bg.png"); 
    background-size: cover; 
    background-attachment: fixed; 
    }

和

.navbar-default { 
     background-image: url(../images/128-198.png); 
     border-radius: 10px; 
     border: solid; 
    }

，所以你需要修改其中之一，看看有什麼變化

來源

2016-04-29 16:32:14

非常感謝。我沒有看到這個，因爲我的軟件使用的代碼告訴我使用../images/ ，但我想我必須更專注下一次！但是，非常感謝很多人（Y） –

不用客氣 –

在您的代碼，你必須記住你的CSS代碼的層次結構。它看起來好像你是與你的風格衝突。層次結構如下：1.In-line屬性2.ID屬性3.Class屬性4，元素

你也調用了很多CSS樣式表，然後添加你自己的。我會先與你兩個人通話玩：

body { 
background-image: url("images/vortrex-bg.png"); 
background-size: cover; 
background-attachment: fixed; 
}

和

.navbar-default { 
    background-image: url(../images/128-198.png); 
    border-radius: 10px; 
    border: solid; 
}

然後檢查，以確保它不會與你通過你的樣式表叫什麼干擾。然後注意你沒有ID屬性，只有類。想想你想要優先考慮什麼，並使用層次結構來獲得優勢。

來源

2016-04-29 17:03:52

導航欄中的自舉圖片

回答

相關問題