'Besondere' Tabellen! Brauche eine außführliche Erklärung!

Hallo,
i-wie verstehe ich vieles von dem Tabellen-zeugs nicht!
Wenn ich jetzt z.B. so eine Tabelle machen will... :

[img]http://img294.imageshack.us/img294/4772/screen68lk0.png[/img]

... wie geht das?

Wie kann ich so eine kleine Leiste oben machen zur Beschreibung der Tabelle?
Wie kann ich die Hintergründe der Tabelle bestimmen?
Wie kann ich es machen das der 'Strich' nur außen sichtbar ist? Also innendrin ist ja kein Strich zur Trennung, nur ganz außen...

Irgendwie kapiere ich die ganzen Tabbellenfunktionen nicht ganz so...

Ich würde mcih wirklcih RIESIG freuen wenn mir jemand eine außführliche Antwort geben würde! (- zu KnuddelWelli rüberschiel lach -)


- Basti

Öh ja, das ist schon ein Brocken, eine Tabelle zu erklären, besonders, weil diese dermaßen mit CSS bearbeitet wurde, dass ich dir nicht ohne weiteres den Code einfach rauskopieren kann. Deshalb werde ich dir nur grob beschreiben, wie man was macht. Ich hoffe, dass das okay ist.



Das geht ganz einfach mit dem <th>-Tag. Der <th>-Tag erzeugt einen Tabellenkopf in den Zellen einer Zeile. In der Kopfzeile sollen Überschriften und Informationen über die Spalten einer Tabelle eingesetzt werden. Der Text wird immer automatisch fett ausgezeichnet. Weiteres, wie den pinken Hintergrund o. Ä. kann man per CSS noch einfügen. Aber zum Hintergrund: siehe weiter unten.


a) per HTML
b) per CSS
Ich würde CSS vorziehen, deshalb auch meine auf CSS basierte Erklärung: nehmen wir mal eine einfache Tabelle mit 2 Zeilen & einer Spalte.

<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>Inhalt der 1. Zeile / Zelle</td>
</tr>
<tr>
<td>Inhalt der 2. Zeile / Zelle</td>
</tr>
</table>

Möchte ich nun für die erste Zeile den Hintergrund mit dem Farbcode #000000 (schwarz) und für die 2. Zeile #FFFFFF (weiß), so setze ich folgendes ein:

<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td [color:"orange"]style="background:#000000;"[/color]>Inhalt der 1. Zeile / Zelle</td>
</tr>
<tr>
<td [color:"orange"]style="background:#FFFFFF;"[/color]>Inhalt der 2. Zeile / Zelle</td>
</tr>
</table>

Mit den Spalten klappt es ganz genauso. Denn das style-Attribut lässt sich so gut wie überall einbauen. Aber ich denke, dass hättest du auch mit ein wenig Googeln selbst herausgefunden.


Vielleicht, indem du der Tabelle das einfach per CSS angibst? -gg- Das sieht dann, gezeigt am oberen Beispiel, wie folgt aus:

<table border="0" cellpadding="0" cellspacing="0" [color:"purple"]style="border: 1px solid #808080;"[/color]>
<tr>
<td [color:"orange"]style="background:#000000;"[/color]>Inhalt der 1. Zeile / Zelle</td>
</tr>
<tr>
<td [color:"orange"]style="background:#FFFFFF;"[/color]>Inhalt der 2. Zeile / Zelle</td>
</tr>
</table>


Wie gesagt, ich würde es mit Googeln versuchen... oder du lädst dir einen WYSIWYG-Editor für deinen PC runter, erstellst damit Tabellen nach deinem Wunsch und widmest dich intensivst dem Quelltext. (So habe ich mir das beigebracht, learning by doing oder so.) Hier hab ich mal einen für dich, der angeblich ganz gut sein soll: SuperHTML; ich selbst benutze ja keinen. Ich schreibe alle meine Sachen von Hand, daher kann ich dir auch nicht wirklich einen empfehlen. Meine Anfänge damals hab ich mit Hilfe von FrontPage gecodet, aber das kann man sich ja nicht runterladen (bzw. nicht legal).

Ich hoffe, meine Antwort war so okay. Falls du noch Fragen hast, stell sie einfach in diesem Thread hier. glücklich


Liebe Grüße, Kat

:D
Ich wusste doch das DU antworten wirst^^
VIELEN DANK! Ich werde jetzt ersteinmal alles ausprobieren... und wenn ich mal wieder nicht weiter weis meld' ich mich hier wieder +g+ :D

Hallo zusammen,

die Lösung von KnuddelWelli ist nicht falsch. Ich allerdings würde eine andere Variante bevorzugen. Ich würde das ganze komplett ohne Tabellen lösen. Das geht wesentlich einfacher und ist auch sauberer. Aber! ich möchte KnuddelWelli nicht(!) als inkompetent darstellen, sondern lediglich deinen Wunsch im Optimum erstellen!




Basti

Hey theblackdevil909851,
ich nehm dir dein Posting auch in keinster Weise übel, schließlich lerne ich auch noch viel von dir. zwinker Ich hielt mich auch nur an Tabellen, weil es im Quelltext des Knuddelsshop so einsehbar und für mich die einfachste Methode zu erklären war.
Mich würde aber trotz alledem interessieren, wie du das ganze anstellen würdest. Würde mich über eine Posting deinerseits dazu freuen. glücklich


Grüße, Kat glücklich

black devil? :o
Ich würde aber gerne deine methode mal ansehn grins
Also wenn du lust hast könntest du das ja auch mal posten glücklich

screenen
Das Bild mit einem Graphikbearbeitungsprogramm zu deinen gnsten verändern un als bild in diene Page einbauen???

Hier sollte mit absolut positionierten <div> -Containern gearbeitet werden.

Ich dachte bisher immer, du seist kein Fan von <DIV>-Containern?! kopfstand

Da hast du auch absolut Recht. Bisher war ich das auch nie. Aber seitdem ich mich intensiver mit dem wBB3 beschäftigt habe, sind <div> -Container eine Wohltat. Das wBB3 kommt mit einer einzigen Tabelle aus, wenn man bedenkt wieviel es bietet, ist das nichts, auch diese Tabelle werde ich in einem Patch zu einem Container umwandeln.

<div> -Container leben hoch! rolleyes

Muss ich das jetzt kapieren? lach

Also, eigentlich bin ich ja total zufrieden damit was KndudelWelli gepostet hat! glücklich Ich komme wirklich sehr gut damit zurecht!



Ich möchte diese Tabelle NICHT 1 zu 1 übernehmen! z.B. möchte ich mehr Spalten und vllt auch andere Farben usw..?! Aber das habe ich jetzt schon alles kapiert! Hab jetzt auch schon einiges hinbekommen! +g+