Hintergrund

Uru · 21. August 2018

Hallo. ich habe eine tabelle und ein hintergrundbild. nur ist es so das der style (css) der tabelle wie border und sowas nicht angezeigt wird. warum?

HTML

<html><head><title>Test</title>
    
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
    
    </head>
    
    
    
    <body>
    

      
<img class="Backgroundi" src="img/1Background.png">
<div class="PC">     
       <div class="page">
      

    <style>
    
        .Backgroundi{
            width: 100%;
            height: 100%;
                             z-index: -1;
        }
        
        .page{
                       
            margin-top: -650px;
            background-size: cover;
        }
    
    </style>
    <!-- Navigation, Logo -->
      
             <div class="navigation animated slideInDown">
    
                 
             <br>
      <ul class="topnav">
      <li><a href="index.html">Willkommen</a></li>
  <li><a href="oeffnungszeiten.html">Öffnungszeiten</a></li>
  <li><a href="preise.html">Preise</a></li>
  <li><a href="anfahrt.html">Anfahrt</a></li>
  <li><a href="impressum.html">Impressum</a></li>
      </ul>
      
      
            </div>
    
       <a href="index.html"><img class="Logo animated slideInLeft" src="img/Logo.png"></a>
    
    

    
    
    
    
    <br><br><br><br>
    <br><br><br><br>




<style>
    
    h1{
    text-align: center;
      font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;}
    
    
#tabelle {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
    text-align: right;
                     z-index: 2;
}

#tabelle td, #customers th {
    border: 1px solid #ddd;
    padding: 8px;
    z-index: 2;
}
    
    
 

    #tabelle tr:nth-child(even){background-color: #f2f2f2;}

#tabelle tr:hover {background-color: #ddd;}

#tabelle th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: right;
    background-color: #4CAF50;
    color: white;
    z-index: 2;
}
</style>
           
           
           
           <table id="tabelle"><tr>
               <td>Test</td>
               <td>Test</td>
               
               </tr></table>

</div>
    </div>    


</body></html>

Alles anzeigen

basti1012 · 21. August 2018

Du solltest dir mal die html Grund Kenntnisse ankucken. Bei dein html ist einiges verkehrt.

https://www.html-seminar.de/html-grundlagen.htm

auch die Style angaben gehören im head Bereich oder noch besser auslagern.

Eine Tabelle hat eigentlich auch <th> <tbody> <thead> Tags wenn man es richtig machen möchte.

Versuche das mal zu sortieren ,dann bin ich sicher das es auch klappen wird

Dein Hauptgrund das gar nix angezeigt wird ist auch die Eingabe bei

Code

.page{
                       
            margin-top: -650px;
            background-size: cover;
        }

weil Minus 650 Pixel ist wahrscheinlich auch weit aus den Sichtbaren Bereich. Je nachdem was für ein Bild du da nutzt.

Da du das Bild auf minus 1 hast denke ich mal das du da ein Hintergrund Bild raus basteln wolltest ,kann das sein ? Erzähl mal was du da vor hast dann helfen wir mal ein wennig

m.scatello · 21. August 2018

Das ist grausamer Quellcode! Lagere dein CSS in eine externe Datei aus und binde diese ein.

Uru · 21. August 2018

basti1012 Genau. Ich wollte das als Hintergrund machen und darauf die Tabelle. Ich mache html noch nich lang.

Sempervivum · 21. August 2018

doctype fehlt.

Den Hintergrund der Seite solltest Du auch als background-image mit CSS anlegen, dann funktioniert auch background-size:cover

Code

body {
    background-image: url(img/1Background.png);
    background-size: cover;
}

Dann erübrigt sich auch das negative margin.

Die style-Tags hast Du ziemlich unkonventionell angeordnet, besser alles in den head-Bereich legen.

Ein Großteil der Formatierung deiner Tabelle ist nicht sichtbar, weil Du keinen Kopf definiert hast und nur eine Zeile. Wenn ich einen Kopf und weitere Zeilen einfüge, ist auch die Formatierung sichtbar.

Uru · 21. August 2018

Danke

Hintergrund

Jetzt mitmachen!

Teilen