Tabellen

Status
Nicht offen für weitere Antworten.

Aloa

Erfahrenes Mitglied
Ich mal wieder mit fragen.
Also ich hab jetzt mal ein Design mit Photoshop gemalt. vielleicht, kann mir beim coden jemand helfen, denn ich bekommen das nicht hin.

So soll die Seite ungefähr aussehen. (farben stimmen nicht)

Bild
 
ich würde vorschlagen es per css zu machen. Auf Tutorials gibt es dazu ein tut
http://www.tutorials.de/tutorials187137.html
bzw ich empfehle auch folgende Seite
http://glish.com/css/
wenn du googelst findest du sicher auch gute deutschsprachige Seiten.
Ansonsten einfach weiter fragen.

Übrigends könntest du bei deinem Hintergrund bei variablen Fensterbreiten Probleme bekommen.

Ansonsten würde ich mich anschließen: Wir brauchen mehr Infos darüber was du überhaupt willst.
 
shutdown hat gesagt.:
1. Rein Html oder CSS?
2. Was verstehst du nicht?

Den Aufbau. Ich weiss nie wie das geht. Es geht darum, dass ich das nicht selber gestalten kann (tabellen und frames) und um eure hilfe bitte
 
Nimm die ein karriertes Blatt.
Zeichne die verschiedenen Blöcke (zB dein Hintergrund, graue zentrierte Box, Banner, Navigation, Hauptfenster)
Dann schreibst du überall Pixelmaße ran.
Dann erarbeitest du dir die Grundlagen in css oder leites deinen Code Parallel zu anderen Projekten ab.

Ohne Grundlagen wird das eh nix.
 
hab ich gemacht bevor ich diesem Thread geschrieben habe.

Ich habs auch mehrere Stunden versucht. klappt nie.

Vielleicht kann ist ja einer so nett und kann mir den code eben kreiren.
danke
 
Wenn wir dir hier einfach nur den Code schreiben bringd das garnichts. Wir machen das einfach zusammen. Ich hoffe du hast Ahnung von css.

1. Schritt Hintergrund

Füge in den body dieses blaue Hintergrundbild ein.

2. Schritt grauer container

Den grauen zentrierten hintergrund fügst du jetzt ein mit folgenden eigenschaften.
position: absolute;
left:50%;
height: 100%;
width: 700px;
margin-left: -350px; //die Hälfte von der Breite
padding: 10px

3. Schritt Banner

Diesen legst du in den container aus dem 2. Schritt
daher orientiert sich dieser an dem.

4. Schritt Navi + Hauptfenster

Diese kannst du, wenn du willst unter den banner legen, oder in einer neuen ebene darüber. Bei der 2. Variante musst du bedenken, das du das Element mit Top unter den Banner ziehst.

So würde ich vorgehen. Stückchen für Stückhen. Aber nicht ohne Grundlagen.
 
Ok ich hab daran mal weitergewerkelt.
Ich hab trotzdem Probleme.
Der Inlineframe besetz sozusagen die ganze Mitte. Ich möchte, dass das Inlineframe in der Mitte geteilt wird und nach rechts verlagert. Auf der Linken hälfte soll noch eine Tabelle hinkommen wie ich sie ganz oben gezeichnet habe.
Außerdem muss um den Inlineframe in jeder richtung eine 5 Pixel breite Tabelle.
Hier mein Code. würde mich freuen wenn mir jemand helfen könnte.
Code:
<html>
  <head>
    <title>Titel</title>
    <style type="text/css">

  body
    {
      background-color: #FFFFFF;
      font-family: verdana;
      font-size: 10px;
      color: #000000;
      font-style: normal;
      font-weight: normal;
      margin: 0;
    }

    #centerDiv
    {
    position: absolute;
    left: 50%;
    width: 745px;
    margin-left: -372.5px; /* neg. Hälfte von width:745px = horizontal zentriertes DIV */
    top: 50%;
    height: 592px; /* Tatsächliche Tabellen-Höhe */
    margin-top: -296px; /* neg. Hälfte von height:592px = vertikal zentriertes DIV */
    }

    a:link, a:visited
    {
      font-weight: normal;
      color: #FF9900;
      text-decoration: none;
    }
    a:hover
    {
      font-weight: normal;
      color: white;
      text-decoration: none;
      background-color: #FF9900
  </style>


  </head>
  <body>
    <div id="centerDiv" style="width: 768; height: 596">
      <table border="1" width="745" id="table1" height="500" cellspacing="0" bordercolorlight="#000000" style="border-collapse: collapse" cellpadding="0" bordercolordark="#000000">
        <tr>
          <td height="30" colspan="8" bgcolor="FFFFFF" width="745">
            <font color="#FFFFFF">&nbsp; </font>
          </td>
        </tr>
        <tr>
          <td rowspan="4" width="10" height="500" bgcolor="FFFFFF">
            <font color="#FFFFFF">&nbsp; </font>
          </td>
          <td height="109" colspan="6" width="674">
            &nbsp;</td>
          <td rowspan="4" border="1" width="10" height="500" bgcolor="FFFFFF">
            <font color="#FFFFFF">&nbsp; </font>
          </td>
        </tr>
        <tr>
          <td height="36" width="229" bgcolor="FFFFFF">
            &nbsp;</td>
          <td height="36" colspan="5" bgcolor="FFFFFF" width="445">
            &nbsp;
          </td>
        </tr>
        <tr>
          <td colspan="6" height="400" bgcolor="FFFFFF" width="674">
            <span style="font-size: 8pt">
            <iframe name="I1" height="100%"
            width="100%" border="0" frameborder="0" target="inhalt" src="home/home.html">
            Ihr Browser unterstützt Inlineframes nicht oder zeigt sie in der
            derzeitigen Konfiguration nicht an.</iframe></span>
          </td>
        </tr>
        <tr>
          <td height="24" colspan="6" bgcolor="FFFFFF" width="674">
            <p align="center" style="font-size: 8pt">
            &nbsp;</p>
          </td>
        </tr>
      </table>
    </div>
  </body>
</html>
 
Beim Lesen deines Source-Codes hatte ich gerade ein Déjà-vu :suspekt:

Und siehe da >>> Tabelle fehlerhaft


Besonders viel hast du an dem Source aber nicht weitergewerkelt bzw. ausprobiert, ausser die graue Tabellenzellen-Hintergrundfarbe dem weissen Seitenhintergrund anzupassen, sowie die Navigation und das Copyright zu entfernen ...


Modifizierter Source-Code:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Titel</title>
<style type="text/css">
<!--
body
    {
      background-color: #FFFFFF;
      font-family: verdana;
      font-size: 10px;
      color: #000000;
      font-style: normal;
      font-weight: normal;
      margin: 0;
    }

div#centerDiv
    {
    position: absolute;
    left: 50%;
    width: 745px;
    margin-left: -372.5px; /* neg. Hälfte von width:745px = horizontal zentriertes DIV */
    top: 50%;
    height: 600px; /* Tatsächliche Tabellen-Höhe */
    margin-top: -300px; /* neg. Hälfte von height:600px = vertikal zentriertes DIV */
    }

table#table1
    {
    width: 745px;
    height: 600px; /* Tatsächliche Tabellen-Höhe */
    border-collapse: collapse;
    }

a:link, a:visited
    {
      font-weight: normal;
      color: #FF9900;
      text-decoration: none;
    }

a:hover
    {
      font-weight: normal;
      color: white;
      text-decoration: none;
      background-color: #FF9900;
    }
-->
</style>

</head>
  <body>
    <div id="centerDiv">
      <table border="1" id="table1" cellspacing="0" cellpadding="0">
        <tr>
          <td height="30" colspan="8" bgcolor="FFFFFF" width="745">
            <font color="#FFFFFF">&nbsp; </font>
          </td>
        </tr>
        <tr>
          <td rowspan="4" width="10" height="500" bgcolor="FFFFFF">
            <font color="#FFFFFF">&nbsp; </font>
          </td>
          <td height="109" colspan="6" width="725">
            &nbsp;</td>
          <td rowspan="4" border="1" width="10" height="500" bgcolor="FFFFFF">
            <font color="#FFFFFF">&nbsp; </font>
          </td>
        </tr>
        <tr>
          <td height="36" width="362" bgcolor="FFFFFF">
            &nbsp;</td>
          <td height="36" colspan="5" bgcolor="FFFFFF" width="362">
            &nbsp;
          </td>
        </tr>
        <tr>
        <td height="36" width="362" bgcolor="FFFFFF">
            &nbsp;</td>
           <td colspan="5" height="400" bgcolor="FFFFFF" width="362">
            <iframe name="I1" height="400"
            width="362" border="0" frameborder="0" src="home/home.html">
            Ihr Browser unterstützt Inlineframes nicht oder zeigt sie in der
            derzeitigen Konfiguration nicht an.</iframe>
          </td>
        </tr>
        <tr>
          <td height="24" colspan="6" bgcolor="FFFFFF" width="725">
            <p align="center" style="font-size: 8pt">
            &nbsp;</p>
          </td>
        </tr>
      </table>
    </div>
  </body>
</html>
 
Zuletzt bearbeitet von einem Moderator:
Ich hab auf meinem Rechner sehr viel versucht es zu verändern, was auch geklappt hat.
Um den Code ins Internet zu stellen, musste ich so viel wie möglich entfernen,
wegen begrenzter Anzahl von Buchstaben.
Deswegen sieht das da ungeändert aus.

Ich danke für den Code und werde mir den erstmal anschauen.
Wenn es Probleme gibt werde ich mich melden.
 
Status
Nicht offen für weitere Antworten.
Zurück