Ergebnis 1 bis 4 von 4

Thema: Einsteiger - background image wird nicht angezeigt.

  1. #1
    HTML Newbie
    Registriert seit
    11.01.2019
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Einsteiger - background image wird nicht angezeigt.

    Hi Leute,

    ich hab ein seltsames Problem und wenig Erfahrung. Leider raff ich so gar nicht was ich falsch mache... Hoffe Ihr könnt mir helfen.

    Vor der Freischaltung unseres Webspace bei strato hab ich auf einem 1und1 webspace angefangen eine Seite für unseren Clan zu bauen.
    Bei 1und1 siehts so aus wie ich mir das gedacht habe, bei strato wird das Hintergrund Bild nicht angezeigt. Probieren schon seit etlichen Stunden.
    hab natürlich erst mal den Fehler im Code gesucht. Jetzt hab ich verzweifelt aufgegeben... Mir geht's erst mal nur um die index.php. Bei den restlichen Seiten muss ich noch den Quelltext bereinigen.


    1und1 - http://www.lehei.de/TGU/index.php
    strato - http://www.thegamingunit.de


    Ich hoffe Ihr könnt mir helfen. Der Quelltext besteht aus mehreren teilen: 3 PHP Dateien + 3 CSS Dateien. Leider hab ich wenig Erfahrung mit CSS, ist ewig her das ich ne Seite gebaut hab.
    Vielen Dank im Voraus für Eure Hilfe. Ich denke der Fehler ist in der style_basic oder der index.php. Bitte lasst euch nicht von der länge abschrecken, das meiste ist bloß der content, wollte aber sich gehen dass das Problem nicht da entsteht.:

    navi.php:
    PHP-Code:
    <!--
    Anfang Navi
    -->

    <
    div id="topnavi" align="left"></div>
    <
    div class="wrapper_navi">
    <
    ul id="navibereich">
      <
    li id="navi01"><a href="index.php">Home</a></li>
      <
    li id="navi09"><a href="ueber_uns.php">&Uuml;ber uns</a></li>
      <
    li id="navi04"><a href="regeln.php">Clan Regeln</a></li>
      <
    li id="navi02"><a href="spiele.php">Spiele</a></li>
      <
    li id="navi03"><a href="videos.php">Videos</a></li>
      <
    li id="navi10"><a href="twitch.php">Twitch</a></li>
      <
    li id="navi05"><a href="kontakt.php">Kontakt</a></li>
      <
    li id="navi08"><a href="bewerbung.php">Mitglied werden</a></li>
    </
    ul>
    </
    div>

    <!--
    Ende Navi
    --> 
    footer.php:
    PHP-Code:
    <!--
    Anfang Footer
    -->


    <
    div id="footer" align="center">
    <
    ul id="navi_footer" align="center" >
      <
    li id="navi06"><a href="impressum.php">Impressum</a></li>
      <
    li id="navi07"><a href="datenschutz.php">Datenschutz</a></li>
    </
    ul>
    </
    div>

    <!--
    Ende Footer
    --> 
    index.php:
    PHP-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>TGU - the gaming unit -- Willkommen</title>
    <meta name="description" content="TGU - the gaming unit - Willkommen auf unserer Homepage. Wir sind ein Battlefield-Clan, spielen aber auch andere Games">
    <meta name="keywords" content="TGU, gaming, clan, Multigaming, Battlefield, PUBG, Player, Battlegrounds, Ring, Elysium, League, Legends, Mitglied">
    <meta name="author" content="TGU - the gaming unit">
    <meta name="editor" content="html-editor phase 5">
    <link rel="stylesheet" href="style_basic.css" type="text/css">
    <link rel="stylesheet" href="style_navi.css" type="text/css">
    <link rel="stylesheet" href="style_index.css" type="text/css">
    </head>
    <body id="Home">

    <!--
    Anfang Navi
    -->
    <?php
    include ("navi.php");
    ?>
    <!--
    Ende Navi
    -->

    <!--
    Anfang Banner
    -->
    <div id="banner">

    <br>
    <br>

    <div id="TGU">
    TGU
    </div>
    <div id="TGU2">
    the gaming unit
    </div>

    </div>
    <!--
    Ende Banner
    -->

    <!--
    Anfang Content
    -->
    <div id="trenner"></div>
    <div class="wrapper_content">

    <div id="links" align="left">
    <h1>&Uuml;ber Uns</h1>
    Wir legen Wert auf einen freundlichen Umgang miteinander, f&uuml;r uns steht der Spa&szlig; am Spiel im Vordergrund. 
    <br>
    <br>
    Wir sind &uuml;berwiegend zwischen 20 und 40 Jahre alt und haben verschiedenste Hintergr&uuml;nde. Vom Studenten/in bis zum Familienvater ist alles mit dabei und willkommen.
    <br>
    <br>
    <a href="ueber_uns.php">weiter lesen...</a>
    <br>
    <br>
    <br>
    <br>
    <br>
    <h1>Clan Regeln</h1>
    Die Kurzversion - sein kein Arsch. 
    <br>  
    <br>
    Im Gro&szlig;en und Ganzen gelten bei uns die ganz normalen Regeln f&uuml;r ein gesundes Miteinander. Wir sind doch alle hier um Spa&szlig; zu haben. 
    <br>
    <br>
    F&uuml;r alle weiteren Details bitte einmal unten auf weiter lesen klicken.
    <br>
    <br>
    <a href="regeln.php">weiter lesen...</a>
    </div>

    <div id="mitte" align="left">
    <h1>Spiele</h1>
    Aktuell spielen wir nat&uuml;rlich viel Battlefield V. Das hei&szlig;t aber nicht, dass wir nicht auch mal was anderes zocken. Es gibt bei uns auch aktive League of Legends Spieler, wir spielen PUBG, Ring of Elysium und andere Games.
    <br>
    <br>
    <a href="spiele.php">weiter lesen...</a>
    <br>
    <br>
    <h1>Mitglied werden</h1>
    Haben wir Euer Interesse geweckt?!
    <br>
    Das freut uns! 
    <br>
    <br>
    Es w&auml;re sch&ouml;n wenn Ihr dem unten-stehenden Link zum Bewerbungsformular folgt. Dann h&auml;tten wir schon mal ein paar Infos &uuml;ber Euch. 
    <br>
    <br>
    Alternativ k&ouml;nnt Ihr uns aber auch ganz unb&uuml;rokratisch direkt auf unserem Discord ansprechen. Unsere Clan Leader sind aber nat&uuml;rlich nicht zu jeder Zeit online.
    <br>
    <br>
    <a href="bewerbung.php">zum Bewerbungs-Formular</a>
    </div>

    <div id="rechts" align="left">
    <h1>Discord</h1>
    <iframe src="https://discordapp.com/widget?id=428195849760407562&theme=dark" width="260" height="555" allowtransparency="true" frameborder="0"></iframe>
    <br>
    <br>
    <br>
    </div>

    <p class="back">  
    <br>
    </p>

    </div>
    <!--
    Ende Content
    -->

    <!--
    Anfang Footer
    -->
    <?php
    include ("footer.php");
    ?>

    <!--
    Ende Footer
    -->

    </body>
    </html>
    style_navi.css (für alle Seiten):
    Code:
    .wrapper_navi {
        width: 900px;
        margin: 0 auto;
        background-color: #000000;
    }
    
    #topnavi {
      position: realtive;
      height: 50px; width: 900px;
      background-color: #000000;        /* Hintergrundfarbe für die Navigation */
    }
    
    #navibereich {
      position: realtive;
      height: auto; width: 900px;
      background-color: #000000;        /* Hintergrundfarbe für die Navigation */
      padding: 4px 0;                   /* Innenabstand: oben/unten 4px, li/re 0 */
      border-top: 0px solid #668BCC;    /* Rahmenlinie oben */
      border-bottom: 5px solid #000000; /* Rahmenlinie unten */
      margin: 0;                        /* Keinen Außenabstand */
      font-family: Impact;                      /* Schriftart */
      font-size: 20px;
    }
    
    #navibereich li {
      display: inline;            /* Listenelemente nebeneinander */
      list-style-type: none;      /* Aufzählungszeichen entfernen */
    }
    
    #navibereich a {
      color: #fb911b;                  /* Schriftfarbe schwarz */
      text-decoration: none;         /* Unterstreichung entfernen */
      padding: 4px 8px;              /* oben/unten 4px, re/li 8px */
      font-family: Impact;
      }
    
    #navibereich a:hover {
      background-color: #fb911b;
      color: #000000;
      font-family: Impact;
    }
    
    #navibereich a:hover,        /* mit Komma am Ende */
    #Home #navi01 a,       /* mit Komma am Ende */
    #Spiele #navi02 a,       /* mit Komma am Ende */
    #Videos #navi03 a,       /* mit Komma am Ende */
    #Twitch #navi10 a,       /* mit Komma am Ende */
    #Ueber_uns #navi09 a,       /* mit Komma am Ende */
    #Regeln #navi04 a,       /* mit Komma am Ende */
    #Kontakt #navi05 a,
    #Bewerbung #navi08 a,
    #Forum #navi11 a
     {    /* ohne Komma am Ende */
      background-color: #fb911b;
      color: #000000;
      font-family: Impact;
    }
    
    /* Ende Navigation */
    
    
    
    /* footer */
    
    #navi_footer {
      position: realtive;
      background-color: #000000;        /* Hintergrundfarbe für die Navigation */
      padding: 4px 0;                   /* Innenabstand: oben/unten 4px, li/re 0 */
      margin: 0;                        /* Keinen Außenabstand */
      font-family: Impact;                      /* Schriftart */
      font-size: 20px;
    }
    
    #navi_footer li {
      display: inline;            /* Listenelemente nebeneinander */
      list-style-type: none;      /* Aufzählungszeichen entfernen */
    }
    
    #navi_footer a {
      color: #fb911b;                  /* Schriftfarbe schwarz */
      text-decoration: none;         /* Unterstreichung entfernen */
      padding: 4px 8px;              /* oben/unten 4px, re/li 8px */
      font-family: Impact;
      }
    
    #navi_footer a:hover {
      background-color: #fb911b;
      color: #000000;
      font-family: Impact;
    }
    
    #navi_footer a:hover,        /* mit Komma am Ende */
    #Impressum #navi06 a,       /* mit Komma am Ende */
    #Datenschutz #navi07 a,       /* mit Komma am Ende */
      background-color: #fb911b;
      color: #000000;
      font-family: Impact;
    }
    /* Ende Footer *
    
    
    style_basic.css (für alle Seiten):
    body {
        background-color: #000000;
        margin: 0;
        padding: 0;
    }
    
    #banner {
      position: realtive;
      background-position: center;
      height: 500px; width: 100%;
      background-image: url("gfx/banner2.jpg");
      border-top: 2px solid #2F2F2F;
      border-bottom: 2px solid #2F2F2F;
    }
    
    #TGU {
      position: relative;
      color: #fb911b;                  /* Schriftfarbe schwarz */
      font-family: Impact;
      font-size: 100px;
      width: 900px;
      margin: 0 auto;
      line-height: 100px;
      text-shadow: #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px,
                 #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px;
    }
    
    #TGU2 {
      position: realtive;
      color: #fb911b;                  /* Schriftfarbe schwarz */
      font-family: Impact;
      font-size: 40px;
      width: 900px;
      margin: 0 auto;
      line-height: 40px;
      text-shadow: #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px,
                 #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px;
    }
    
    #trenner {
      position: realtive;
      height: 20px; width: 900px;
      background-color: #000000;        /* Hintergrundfarbe für die Navigation */
    }
    
    .wrapper_content {
        width: 900px;
        margin: 0 auto;
        background-color: #000000;
        color: #707070;                  /* Schriftfarbe schwarz */
        font-family: Arial;
        font-weight: 300;
        text-align: left;
    }
    
    .wrapper_content h1{
      color: #fb911b ;                  /* Schriftfarbe schwarz */
      font-family: Impact;
      font-size: 35px;
      line-height: 40px;
      text-shadow: #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px,
                 #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px;
    }
    
    .wrapper_content h2{
      color: #fb911b ;                  /* Schriftfarbe schwarz */
      font-family: Arial;
      font-size: 20px;
      line-height: 20px;
      text-shadow: #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px,
                 #000 0px 0px 1px,   #000 0px 0px 1px,   #000 0px 0px 1px;
    }
    
    .wrapper_content a{
    color:#fb911b;
    font-weight:bold;
    text-decoration:none;
    }
    
    .wrapper_content a:hover{
    color:#FF3F00;
    font-weight:bold;
    text-decoration:none;
    }
    
    
    style_index.css (für die index.php):
    #links {
      float: left;
      width: 30%;
      background-color: #000000;
    }
    
    #rechts {
      float: left;
      width: 32%;
      background-color: #000000;
    }
    
    #mitte {
      float: left;
      width: 30%;
      margin: 0px 2%;
      background-color: #000000;
    }
    
     p.back {
      clear: both;
      text-align: center;
    }
    Geändert von Arne Drews (11.01.2019 um 17:14 Uhr) Grund: MOD: Code-Tags eingefügt

  2. #2
    Samurai
    Registriert seit
    23.01.2018
    Ort
    Minden
    Beiträge
    225
    Danke
    0
    Bekam 30 mal "Danke" in 30 Postings

    Standard AW: Einsteiger - background image wird nicht angezeigt.

    Bei den angegebenen Bild Link in dein Quellcode
    http://www.thegamingunit.de/gfx/banner.jpg
    Ist kein Bild vorhanden.

    Hier bei den gepostet Code hast du den Link drinne
    gfx/banner2.jpg drinne ist aber auch kein Bild zu sehen. Überprüfe a den Pfad und Kucke ob da auch ein Bild zu sehen ist.
    Rufe erstmal nur den Link des Bildes über den Browser auf. Wenn das geht ,geht der rest dann auch mit den richtigen pfad im Code
    Geändert von basti1012 (11.01.2019 um 16:56 Uhr)

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    11.01.2019
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Einsteiger - background image wird nicht angezeigt.

    Besten Dank für die schnelle Antwort.


    Du hast recht, hab aber trotzdem noch ein Problem.
    Wenn ich per FTP drauf geh ist das Bild an Ort und Stelle.
    Über den Browser kann ich es aber nicht aufrufen.

    Habs jetzt ausprobiert mit Bild im Stammverzeichnis. Auch das funktioniert nicht.

    Hast du noch eine Idee?

    - - - Aktualisiert - - -

    Hab mein Problem gefunden. Man achte auf Groß und Kleinschreibung. rrrrrrrrrrrrrrrrrr

    Trotzdem besten Dank. Ohne deinen Tip wär ich nie drauf gekommen...

  4. #4
    König(in)
    Registriert seit
    13.06.2012
    Beiträge
    1.343
    Danke
    17
    Bekam 72 mal "Danke" in 70 Postings

    Standard AW: Einsteiger - background image wird nicht angezeigt.

    Und wenn du konsequent auf UTF-8 setzt, kannst du solche Spielchen in Zukunft lassen.

    Code:
    <li id="navi09"><a href="ueber_uns.php">&Uuml;ber uns</a></li>
    Man kann dann dies schreiben:

    Code:
    <li id="navi09"><a href="ueber_uns.php"ber uns</a></li>
    Im Dateinamen ist ue in Ordnung.

    MfG
    Gegen Mods kommt man nicht an, die haben immer Recht. Sind scheinbar nicht kritikfähig.

Ähnliche Themen

  1. Background Image wird im Internet Explorer nicht angezeigt
    Von Foulfang im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 27.04.2010, 13:50
  2. Erklärung: Background Image nicht sichtbar, clear hilft ?
    Von Kiiwii im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 20.07.2008, 20:46
  3. php-css findet Background-Image nicht
    Von Mütze im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 7
    Letzter Beitrag: 21.01.2007, 18:08
  4. List-Style-Image wird im IE angezeigt, im firefox nicht
    Von liebhab-baer im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 13.10.2006, 22:13
  5. background-image wird nicht angezeigt
    Von pengo im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 04.07.2006, 14:45

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •