• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tabelle erstellen! Wer kann mir helfen?

Status
Für weitere Antworten geschlossen.

cult7

Neues Mitglied
Hallo,

Ich versuche mir gerade die Tabellen in html selber beizubringen. Eben mit rowspan bzw colspan.

Inzwischen kenne ich mich auch schon etwas aus, aber mit folgenden 2 Tabellen habe ich einfach Probleme...

Vielleicht kann mir jemand den Code schreiben, damit ich mir diesen ansehen kann um zu sehen was ich immer falsch mache...

Ist für einen Profi sicher nur eine Kleinigkeit, aber ich sitze nun schon über eine Stunde an den beiden Tabellen und ich komme einfach nicht drauf was ich falsch mache... :-(

Vielen Dank!
 

Anhänge

  • Tabelle_c.JPG
    Tabelle_c.JPG
    19,9 KB · Aufrufe: 19
  • Tabelle_t.JPG
    Tabelle_t.JPG
    21,4 KB · Aufrufe: 18
Tabelle c:

HTML:
<table border="1">
	<tr>
		<td colspan="2">1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>1</td>
		<td>2</td>
		<td colspan="2">3</td>
	</tr>
</table>

Evtl. hilft dir das, die 2. zu machen.
 
Zuletzt bearbeitet:
Danke für die Hilfe. Die Grundbefehle mit rowspan und colspan kenne ich schon. Manche Tabellen sind auch kein Problem mehr. Aber den den 2en (siehe Anhang) klappt es irgendwie nicht so...

Der komplette Code für die 2 Tabellen wäre super, dann könnte ich mir ansehen was ich falsch gemacht habe...

Danke!:???:
 
Ich geh mal davon aus, das die grauen Linien nur Hilfslinien sind.
Code:
<table border="1">
  <tr>
    <td rowspan="2">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr>
</table>
Höhen und Breiten der einzelnen Zellen und der Tabelle mußt du halt noch angeben. ;-)
 
Das war bestimmt so gemeint:
Code:
<html> 
<head>
  <title>Linie</title>
  <style type="text/css">
     .tabz {
       border: solid 1px #000;
       padding: 3px 8px;
     }
     .taba {
       border-top: solid 1px #000;
       border-left: solid 1px #000;
       border-right: solid 1px #000;
       border-bottom: 0;
       padding: 3px 8px;
     }
     .tabb {
       border-top: 0;
       border-left: solid 1px #000;
       border-right: solid 1px #000;
       border-bottom: 0;
       padding: 3px 8px;
     }
     .tabc {
       border-top: 0;
       border-left: solid 1px #000;
       border-right: solid 1px #000;
       border-bottom: solid 1px #000;
       padding: 3px 8px;
     }
     .tabd {
       border: solid 1px #000;
       padding: 3px 8px;
     }
  </style>
</head> 
<body>
<p>Tabelle C</p>
<table cellspacing="0" class="tabz">
  <tr>
    <td colspan class="tabz">Zeile 1 Spalte 1</td>
    <td class="tabz">Zeile 1 Spalte 2</td>
    <td class="tabz">Zeile 1 Spalte 3</td>
  </tr>
  <tr>
    <td class="tabz">Zeile 2 Spalte 1</td>
    <td class="tabz">Zeile 2 Spalte 2</td>
    <td colspan="2" class="tabz">Zeile 2 Spalte 3</td>
  </tr>
</table>

<p>Tabelle Z</p>
<table cellspacing="0" class="tabz">
  <tr>
    <td class="taba">Zeile 1 Spalte 1</td>
    <td class="taba">Zeile 1 Spalte 2</td>
  </tr>
  <tr>
    <td class="tabb">Zeile 2 Spalte 1</td>
    <td class="tabc">Zeile 2 Spalte 2</td>
  </tr>
  <tr>
    <td class="tabc">Zeile 3 Spalte 1</td>
    <td class="tabd">Zeile 3 Spalte 2</td>
  </tr>
</table>

</body> 
</html>
 
Danke für Eure Hilfe!

Aber die Tabellen waren etwas anders gemeint...

nur die schwarzen Linien sind richtig. Die hellen sind nur als Richtlinie für den Raster gedacht...

Ausserdem bin ich erst bei den Befehlen colspan und rowspan. Was die Bezeichnungen wie "class, solid, padding" bedeuten weis ich noch nicht. Die Tabellen sollten eigentlich mit den simpelsten Befehlen gelöst werden können...

zu. Tab_c:
Wo die hellgrauen Linien sind, darf nicht sein...

zu. Tab_t
zum Teil richtig, aber es sollen eigentlich 5 Felder sein (siehe helle Rasterlinien) und nicht mit dem Befehl "class" sondern nur mit calspan und rowspan...


Vielen Dank für Eure Unterstützung!
 
Was die Bezeichnungen wie "class, solid, padding" bedeuten weis ich noch nicht.

class steht für eine Klasse. Den verschiedenen Tabellenzellen werden hier unterschiedliche Klassen zugewießen, die dann mit CSS formatiert werden können. Unter anderem kannst du verschiedenen Klassen zum Beispiel verschiedene Ränder, Hintergrundfarben, Schriftarten etc. zuweißen.

solid steht für die verwendete Rahmenart. Ein solider Rahmen ist soeiner wie du willst, einfach eine durchgezogene Linie. Nebenher existieren unter anderem auch noch dotted für gepunktete Linien und dashed für gestrichelte Linien.

padding steht für einen Innenabstand, es legt den Abstand zwischen den Rändern (border) und den inhalten fest.
Siehe -> padding: Innenabstand: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets
 
Danke für die Info! Werde diese Sachen sicher in der nächsten Zeit lernen. Aber wie schaut nun der Code für meine zwei Tabellen aus? (mit colspan und rowspan)?



Danke

Kein Profi da, der mir kurz den Code für die beiden Tabellen nur mit colspan und rowspan schreiben kann...

Danke
mfg:cry:
 
Zuletzt bearbeitet von einem Moderator:
hier sind die Codes:

1.Tabelle:
HTML:
<table border="1">
 <tr>
  <td colspan="2">1</td>
  <td>2</td>
  <td>3</td>
 </tr>
 <tr>
  <td>4</td>
  <td>5</td>
  <td colspan="2">6</td>
 </tr>
</table>
2.Tabelle:
HTML:
<table border="1">
 <tr>
  <td colspan="2" rowspan="4">1</td>
  <td colspan="2" rowspan="3">2</td>
 </tr>
 <tr>
  
 </tr>
 <tr>
 
 </tr>
 <tr>
  <td colspan="2">3</td>
 </tr>
</table>
 
@iceman400
Code:
[COLOR=#008080]<table border=[COLOR=#0000ff]"1"[/COLOR]>[/COLOR] [COLOR=#008080]<tr>[/COLOR] [COLOR=#008080]<td colspan=[COLOR=#0000ff]"2"[/COLOR] rowspan=[COLOR=#0000ff]"4"[/COLOR]>[/COLOR]1[COLOR=#008080]</td>[/COLOR] [COLOR=#008080]<td colspan=[COLOR=#0000ff]"2"[/COLOR] rowspan=[COLOR=#0000ff]"3"[/COLOR]>[/COLOR]2[COLOR=#008080]</td>[/COLOR] [COLOR=#008080]</tr>[/COLOR] [COLOR=#008080]<tr>[/COLOR] [COLOR=#008080]</tr>[/COLOR] [COLOR=#008080]<tr>[/COLOR] [COLOR=#008080]</tr>[/COLOR] [COLOR=#008080]<tr>[/COLOR] [COLOR=#008080]<td colspan=[COLOR=#0000ff]"2"[/COLOR]>[/COLOR]3[COLOR=#008080]</td>[/COLOR] [COLOR=#008080]</tr>[/COLOR] [COLOR=#008080]</table>[/COLOR]

Haargenau das gleiche Ergebnis erzielt man auch viel einfacher:
Code:
<table border="1">
   <tr>
     <td rowspan="2">1</td><td>2</td>
   </tr><tr>
     <td>3</td>
   </tr>
</table>
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben