Delphi-PRAXiS - [HTML] Tabelle designen

Seite 2 von 2

Delphi-PRAXiS (https://www.delphipraxis.net/forum.php)

- Programmieren allgemein (https://www.delphipraxis.net/40-programmieren-allgemein/)

- - [HTML] Tabelle designen (https://www.delphipraxis.net/25650-%5Bhtml%5D-tabelle-designen.html)

Re: [HTML] Tabelle designen

ok..ist ein Argument.

Ich hab mal ein bischen rumprobiert.

Ergebnis (Screenshot vom IE):

http://www.codersland.de/bilder/screen.jpg

würde das so aussehen wie du das willst ?

Re: [HTML] Tabelle designen

Ja, allerdings muss ein cellspacing von 1 enthalten sein, das heißt die Zellen vor dem Image müssen verbunden werden, ebenso wie die anderen nach dem Image bis inkl. Spalte 7

Kannst du mir den Code dazu auch noch geben?

Greetz
alcaeus

Re: [HTML] Tabelle designen

Klar:)

Code:

			<Table bgcolor="#000000" border="0" cellspacing="2" cellpadding="5">

<TR>

  <TH align="center" width="46">1</TH>

  <TH align="center" width="46">2</TH>

  <TH align="center" width="46">3</TH>

  <TH align="center" width="46">4</TH>

  <TH align="center" width="46">5</TH>

  <TH align="center" width="46">6</TH>

  <TH align="center" width="46">7</TH>

  <TH align="center" width="46">8</TH>

  <TH align="center" width="46">9</TH>

  <TH align="center" width="46">10</TH>                  

</TR>

<TR>

  <TD colspan="7">TITEL</TD>

  <TD width="46">a</TD>

  <TD width="46">b</TD>

  <TD width="46">c</TD>    

</TR>

<TR>

  <TD width="46">[img]bild.jpg[/img]</TD>

  <TD colspan="6">DOWNLOADS</TD>

  <TD width="46">a</TD>

  <TD width="46">b</TD>    

  <TD width="46">c</TD>    

</TR>

<TR>

  <TD width="46"></TD>

  <TD width="46">[img]bild.jpg[/img]</TD>

  <TD colspan="5">CAT_1</TD>

  <TD width="46">a</TD>

  <TD width="46">b</TD>    

  <TD width="46">c</TD>      

</TR>

<TR>

  <TD colspan="2"></TD>

  <TD width="46">[img]bild.jpg[/img]</TD>

  <TD colspan="4">CAT_2</TD>

  <TD width="46">a</TD>

  <TD width="46">b</TD>    

  <TD width="46">c</TD>      

</TR>

<TR>

  <TD colspan="3"></TD>

  <TD width="46">[img]bild.jpg[/img]</TD>

  <TD colspan="3">CAT_3</TD>

  <TD width="46">a</TD>

  <TD width="46">b</TD>    

  <TD width="46">c</TD>      

</TR>

<TR>

  <TD colspan="2"></TD>

  <TD width="46">[img]bild.jpg[/img]</TD>

  <TD colspan="4">CAT_4</TD>

  <TD width="46">a</TD>

  <TD width="46">b</TD>    

  <TD width="46">c</TD>      

</TR>

<TR>

  <TD width="46"></TD>

  <TD width="46">[img]bild.jpg[/img]</TD>

  <TD colspan="5">CAT_5</TD>

  <TD width="46">a</TD>

  <TD width="46">b</TD>    

  <TD width="46">c</TD>      

</TR>

</Table>

Wie du siehst hab ich sogar mit cellspacing 2 gearbeitet. Sollte also kein Thema sein:)

Re: [HTML] Tabelle designen

Oder noch ein bissl übersichtlicher (für dich):
den Bildstyle als globale Klasse und die gleichen Formatierungen der einzelnen Zeilen in eine tabellenweite Spaltenformatierung umgewandelt
(ach ja, hab mal den Rand ums Bild beitseitig gleich gemacht - wenn die Rahenfarbe des Bildes sich von der Hintergrundfarbe unterscheidet, also der Rahmen sichtbar ist, dürfte es besser aussehn)

Code:

			<HTML>

  <Head>

    <Style>

      .image { border-color:#FFFFFF; border-style:clear; border-width:0px;

               border-left-width:10px; border-right-width:10px; }

    </Style>

  </Head>

  <Body>

    <Table bgcolor="#808080" border="0" cellspacing="2" cellpadding="5">

      <ColGroup>

        <Col span="7" width="46">

        <Col span="3" width="46" align="center">

      </ColGroup>

      <TR>

        <TH align="center">1</TH>

        <TH align="center">2</TH>

        <TH align="center">3</TH>

        <TH align="center">4</TH>

        <TH align="center">5</TH>

        <TH align="center">6</TH>

        <TH align="center">7</TH>

        <TH align="center">8</TH>

        <TH align="center">9</TH>

        <TH align="center">10</TH>      

      </TR>

      <TR>

        <TD colspan="7">TITEL</TD>

        <TD>a</TD>

        <TD>b</TD>

        <TD>c</TD>

      </TR>

      <TR>

        <TD>[img]bild.jpg[/img]</TD>

        <TD colspan="6">DOWNLOADS</TD>

        <TD>a</TD>

        <TD>b</TD>

        <TD>c</TD>

      </TR>

      <TR>

        <TD></TD>

        <TD>[img]bild.jpg[/img]</TD>

        <TD colspan="5">CAT_1</TD>

        <TD>a</TD>

        <TD>b</TD>

        <TD>c</TD>

      </TR>

      <TR>

        <TD colspan="2"></TD>

        <TD>[img]bild.jpg[/img]</TD>

        <TD colspan="4">CAT_2</TD>

        <TD>a</TD>

        <TD>b</TD>

        <TD>c</TD>

      </TR>

      <TR>

        <TD colspan="3"></TD>

        <TD>[img]bild.jpg[/img]

        </TD><TD colspan="3">CAT_3</TD>

        <TD>a</TD>

        <TD>b</TD>

        <TD>c</TD>

      </TR>

      <TR>

        <TD colspan="2"></TD>

        <TD>[img]bild.jpg[/img]</TD>

        <TD colspan="4">CAT_4</TD>

        <TD>a</TD>

        <TD>b</TD>

        <TD>c</TD>

      </TR>

      <TR>

        <TD></TD>

        <TD>[img]bild.jpg[/img]</TD>

        <TD colspan="5">CAT_5</TD>

        <TD>a</TD>

        <TD>b</TD>

        <TD>c</TD>

      </TR>

    </Table>

  </Body>

</HTML>

hab mal die letzten 3 Spalten einzeln formatiert (im Beispiel sind diese zentriert)

aber du kannst auch alle gleich behandeln:

Code:

			...

  <Body>

    <Table bgcolor="#808080" border="0" cellspacing="2" cellpadding="5">

      <ColGroup>

        [color=red]<Col span="7" width="46">[/color]

      </ColGroup>

      <TR>

...

Re: [HTML] Tabelle designen

:firejump: Also, ich habs endlich geschafft! :firejump:

Für alle die den Code dieser Beispieltabelle sehen wollen: siehe Anhang. Jetzt muss ich nur noch irgendwie den Rand einstellen, aber das dürfte mit CSS kein Problem darstellen.

Noch eine Bitte an alle Nicht-IE-Benutzer: könnt ihr mir bitte sagen, wie die Seite in Opera usw. aussieht? Mein Opera 7.23 hat einen Teil der CSS-Eigenschaften nicht interpretiert.

Greetz
alcaeus

PS: Die Domain alcaeus.us.tt ist noch NICHT belegt.

Re: [HTML] Tabelle designen

Moinsen!

Also mit Opera 7.50 sieht es fast genauso aus. Wenn du die Border- dinger bei den BilderLinks gegen

Code:

margin:11px 10px 12px 9px;

austauscht und die verlinketen Bilder direkt - ohne zeilenumbruch und leerzeichen - in <a><img ..</a> tags packst, macht dir opera auch keinen unterstrich bei mouse-hover bei bildern.
opera scheint die border tags zu ignorieren. margin bewirkt das gleich und ist für deinen zweck auch geeigneter da du ja einen abstand und keinen rahmen möchtest!

mfg

Re: [HTML] Tabelle designen

Na klar, hab mal nen Screenshot gemacht. Ach ja, hab den Opera 7.52

Hoffe es hilft Dir weiter

Re: [HTML] Tabelle designen

@Anku und djmasi: Danke, ich habe das selbe Problem beim 7.23 festgestellt, er interpretiert das border bei den images nicht. Ich werde jetzt mal das mit Margin versuchen, und wenn das nicht funktioniert dann werde ich noch einfach ein bisschen "überflüssiges" Zeug ins image reingeben, so dass es am Ende 46x50 Pixel groß ist.

Greetz
alcaeus

PS: Hat jemand die Datei in Netscape, Mozilla oder einem anderen Browser getestet?

Seite 2 von 2