Frage von Rakozou, 27

header-bild wird nicht angezeigt auf der website?

html- und css-code: http://pastebin.com/RMfjz47U

Antwort
von medmonk, 19

Kurz vorweg, dein Markup überarbeiten würde. Statt mit Divisions solltest du den Header auch als solchen auszeichnen. Hier mal ein kleines Snippet:

<header class="header header-cover" role="banner">
   <nav class="header-navbar" role="navigation">
       <!--// navbar here! -->
  </nav>
</header>

Da du Bootstrap verwendet wird, man auch mit dessen Klassen arbeiten kann (sollte). Aber das nur so am Rande. Was jetzt deine eigentliche Frage angeht. Entferne in deinem CSS das hight und width-Attribut bei html, body und geb dem header lediglich eine Höhe von 100vh (vh = Viewport-Hight). Dann sollte alles eigentlich alles wie gewünscht angezeigt werden. 

.header-cover {
     height: 100vh;
     background: url(../img/bgimage-cover2.jpg) no-repeat center;
     background-size: cover;
}

Eine Höhe von 100% dir in sofern nichts nützt. 

Kommentar von Rakozou ,

ist das dann aber noch responsive?

Kommentar von medmonk ,

Ja, ist es. Dein Header immer die komplette Höhe des Viewports nutzt. Genau jener bei jedem Device unterschiedlich ausfällt. Wenn du mehr darüber wissen willst, entweder nach CSS3 viewport-hight (kurz vh) suchen oder mal auf caniuse vorbei schauen. 

Kommentar von Geldon ,

der Mönch hat recht

Antwort
von RakonDark, 21

../ heißt geh ein Orner nach oben , dann in img

Kann es sein das der Order aber im selben Verzeichnis ist wie die aufrufende Datei ?

Kommentar von Rakozou ,

nein , der pfad ist richtig , wenn ich vom bild die höhe mit px angebe funktioniert es , aber wenn ich das mit 100% angebe nicht :/ und ich will , dass es responsive ist 

Keine passende Antwort gefunden?

Fragen Sie die Community

Weitere Fragen mit Antworten