flat: Hintergrundbild einer Zelle und gesammtes HG Bild

Hi,
ich möchte erstmal nur ein Grundgerüst für meiner Homepage und später die Farben festlegen.

Desshalb habe ich hier mal mein Grundgrüst

<html>
<head>

<style type="text/css">
table{background-color:#000000;}
.header{background-color:#FF0000;}
.footer{background-color:#00FF00;}
.menue{background-color:#AAAAAA;}
.inhalt{background-color:#FFFFFF;}
</style>

</head>
<body>
<div align="center"><center>
<table border="0" cellpadding="5" cellspacing="1" width="800">
<tr class="header"><td colspan="2">header</td></tr>
<tr class="menue"><td>navigation</td>
<td class="inhalt" width="100%">inhalt</td></tr>
<tr class="footer"><td colspan="2">footer</td></tr></table>
</center></div>
</body>
</html>

nun habe ich mich dazu entschieden in der Navigationsleiste ein Hintergrundbild einzubauen. Außerdem soll die
geammte Homepage ein Hintergrundbild bekommen. Wie stelle ich das jetzt an?

  1. Hi flat

    Doctype-Angabe fehlt

    <html>
    <head>

    Title-Element fehlt

    <style type="text/css">
    [..]
    </style>
    </head>
    <body>
    <div align="center"><center>

    Was für einen Sinn macht das bitte? Lass center einfach weg.

    <table border="0" cellpadding="5" cellspacing="1" width="800">
    <tr class="header"><td colspan="2">header</td></tr>
    <tr class="menue"><td>navigation</td>
    <td class="inhalt" width="100%">inhalt</td></tr>
    <tr class="footer"><td colspan="2">footer</td></tr></table>
    </center></div>
    </body>
    </html>

    nun habe ich mich dazu entschieden in der Navigationsleiste ein Hintergrundbild einzubauen. Außerdem soll die
    geammte Homepage ein Hintergrundbild bekommen. Wie stelle ich das jetzt an?

    Du kennst http://selfhtml.teamone.de/css/eigenschaften/hintergrund.htm ?

    Schöne Grüße

    Johannes

    --
    ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
    Selfcode bei http://emmanuel.dammerer.at/selfcode.html
    1. Hi Johannes,

      den Hintergrund habe ich jetzt mit <body style="background-image: url('hg.jpg')"> eingebaut. Ich dachte immer, daß geht auch mit

      <style type="text/css">
      ..........
      </style>

      Problem ist jetzt allerdings immernoch der Hintergrund der Zelle, da blicke ich nicht durch.

      1. Hi flat

        den Hintergrund habe ich jetzt mit <body style="background-image: url('hg.jpg')"> eingebaut. Ich dachte immer, daß geht auch mit
        <style type="text/css">...</style>

        geht ja so auch: body {background-image:...}

        Problem ist jetzt allerdings immernoch der Hintergrund der Zelle, da blicke ich nicht durch.

        Das geht genau so.

        Schöne Grüße

        Johannes

        --
        ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
        Selfcode bei http://emmanuel.dammerer.at/selfcode.html
        1. Hier jetzt der geänderte Code. Ist allerdings noch ein Fehler drin den ich nicht raus bekomme. Nun hat Nämlich auch .inhalt das Hintergrundbild wie .menue dieser Soll aber so aussehen .inhalt{background-color:#FFFFFF;}

          <html>
          <head>

          <style type="text/css">
          table{background-color:#000000;}
          .header{background-color:#FF0000;}
          .footer{background-color:#00FF00;}
          .menue { background-image: url('1.jpg');}
          .inhalt{background-color:#FFFFFF;}
          body { background-image: url('2.gif'); }

          </style>

          </head>
          <body>

          <table border="0" cellpadding="5" cellspacing="1" width="800">
          <tr class="header"><td colspan="2">header</td></tr>
          <tr class="menue"><td>navigation</td>
          <td class="inhalt" width="100%">inhalt</td></tr>
          <tr class="footer"><td colspan="2">footer</td></tr></table>

          </body>
          </html>

          Gruß
          Flat

          1. Hi flat

            Hier jetzt der geänderte Code. Ist allerdings noch ein Fehler drin den ich nicht raus bekomme. Nun hat Nämlich auch .inhalt das Hintergrundbild wie .menue dieser Soll aber so aussehen .inhalt{background-color:#FFFFFF;}

            [..]
            <tr class="menue"><td>navigation</td>

            <tr><td class="menue">navigation</td> sollte funktionieren

            <td class="inhalt" width="100%">inhalt</td></tr>
            [..]

            Schöne Grüße

            Johannes

            --
            ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
            Selfcode bei http://emmanuel.dammerer.at/selfcode.html
            1. Hi,
              geht nicht. Damit verändert sich die Tabelle.

              Flat

              1. Hi flat

                geht nicht. Damit verändert sich die Tabelle.

                Dann mach doch ne neue Klasse für diese Zelle.

                Johannes

                --
                ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
                Selfcode bei http://emmanuel.dammerer.at/selfcode.html
                1. Dann mach doch ne neue Klasse für diese Zelle.

                  ????????

                  1. Hi Flat

                    ????????

                    Was willst du damit sagen?

                    Johannes

                    --
                    ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
                    Selfcode bei http://emmanuel.dammerer.at/selfcode.html
                    1. Soll heißen, was willst Du damit sagen:

                      "Dann mach doch ne neue Klasse für diese Zelle."

                      Flat

                      1. Hi flat

                        Soll heißen, was willst Du damit sagen:
                        "Dann mach doch ne neue Klasse für diese Zelle."

                        1. Nimm die Zelle Navigation.
                        2. Füge ein class-Attribut mit einem namen deiner Wahl hinzu
                        3. Füge deiner Stylesheet-definition
                           td.Klassenname {background-image:url(hintergrundbild)

                        Übrigens habe ich das Gefühl, du solltest dich ein bisschen mehr mit [http://selfhtml.teamone.de] beschäftigen.

                        Johannes

                        --
                        ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
                        Selfcode bei http://emmanuel.dammerer.at/selfcode.html
                        1. Hi Johannes,
                          Ich weiß, daß ich mich mehr mit dem Thema beschäftigen müßte.
                          Leider fehlt mir dafür etwas die Zeit. ich habe jetzt mal einiges durchprobiert aber komme nicht zum Ergebnis.

                          Wen ich das jetzt richtig verstanden habe:

                          ich habe an der Stelle an der meine Navigation erscheinen soll eine neue Tabelle erstellt und dort <tr class="menue"> eingesetzt.
                          Ich habe also eine Tabelle in einer Zelle erstellt! Das Navigationsmenü füllt jetzt aber nicht mehr die gesammte Zelle und sieht demnach schei.. aus.

                          Falls Du einen Lösung hast kannst Du mir diese ja mitteilen.

                          Die Tabelle sieht jetzt so aus:

                          <table border="0" cellpadding="3" cellspacing="0" width="800">
                          <tr class="header"><td colspan="2">header</td></tr>
                          <tr><td rowspan="2">
                          <table border="0" cellpadding="0" cellspacing="0"><tr class="menue"><td>Menue</td></tr></table></td>
                          <td class="inhalt" width="100%"><p>Inhalt</td></tr>
                          <tr class="footer"><td width="100%">footer</td></tr></table>

                          Flat

                          1. Hi Flat

                            Ich weiß, daß ich mich mehr mit dem Thema beschäftigen müßte.

                            Einsicht ist der erste Schritt zur Besserung ;-)

                            Falls Du einen Lösung hast kannst Du mir diese ja mitteilen.

                            Du hattest vorhin diese Tabelle gepostet:

                            <table border="0" cellpadding="5" cellspacing="1" width="800">
                            <tr class="header"><td colspan="2">header</td></tr>
                            <tr class="menue"><td>navigation</td>

                            Wenn du diese Zeile so abänderst:
                            <tr class="menue"><td class="navigation">navigation</td>

                            <td class="inhalt" width="100%">inhalt</td></tr>
                            <tr class="footer"><td colspan="2">footer</td></tr></table>

                            Und dann diese Zeile in dein Stylesheet einfügst:
                            .navigation {background-image:url(datei);}
                            müsstest du AFAIK das gewünschte Ergebnis bekommen.

                            Schöne Grüße

                            Johannes

                            --
                            ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
                            Selfcode bei http://emmanuel.dammerer.at/selfcode.html
                            1. Hi Johannes,

                              also ich kann hier ändern was ich will. Ich habe genau gemacht was Du geschrieben hast aber das ausehen der
                              Tabelle verändert sich. Da stimmt was nicht mit <td rowspan="2">. Diese tauchen nämlich in Deinem Code nicht mehr auf.
                              Ist doch klar, daß die Tabelle sich verändert.
                              Anscheinend hast Du ja eine komplette Lösung. Poste diese doch einfach mal.

                              Flat

                              1. Hi Flat

                                Ist doch klar, daß die Tabelle sich verändert.
                                Anscheinend hast Du ja eine komplette Lösung. Poste diese doch einfach mal.

                                Ich hab keine "fertige" Lösung in dem Sinne. Mach einfach die Tabelle wie du sie hattest, und ändere dann den <td>-Tag so ab:
                                    <td style="background-image:url(datei)">
                                Wobei du 'datei' durch den relaitven oder absoluten URL des Bildes ersetzts <-- HIC (Hope it's correct *g*)

                                Schöne Grüße

                                Johannes

                                --
                                ss:| zu:) ls:[ fo:) de:] va:) ch:] sh:( n4:& rl:( br:^ js:| ie:{ fl:( mo:|
                                Selfcode bei http://emmanuel.dammerer.at/selfcode.html