Om nah hoo pez nyeetz, lapaka!

hier mal der HTML-code

Nicht wirklich ;-)

Stecke alle Styleangaben ins CSS!

<table>  
  <thead>  
    <tr>  
      <th>Menge</th>  
      <th>Bezeichnung</th>  
      <th>Einzelpreis</th>  
      <th>Betrag</th>  
    </tr>  
  </thead>  
  <tbody class="Positionen">  
    <tr>  
      <td>{!Produktkauf__c.Menge__c}</td>  
      <td>{!Produktkauf__c.Produktkatalog__c}</td>  
      <td>{!Produktkauf__c.Listenpreis__c}</td>  
      <td>{!Produktkauf__c.Gesamt_inkl_mwst__c}</td>  
    </tr>  
    <!-- ggf. noch mehr Positionen -->  
  </tbody>  
  <tbody class="Summen">  
    <tr>  
      <th colspan="3">Nettobetrag</th>  
      <td>{!Produktkauf__c.Gesamt_vor_MwSt__c}</td>  
    </tr>  
    <tr>  
      <th colspan="3">Mehrwertsteuer</th>  
      <td>{!Produktkauf__c.MwSt1__c}</td>  
    </tr>  
    <tr>  
      <th colspan="3">Rechnungsbetrag</th>  
      <td>{!Produktkauf__c.Gesamt_inkl_mwst__c}</td>  
    </tr>  
  </tbody>  
</table>

Das könnte/sollte dein zugrunde liegendes HTML werden.

Für die Gestaltung siehe Wiki - Schriftformatierung, Wiki - Tabellenformatierung sowie Wiki - border

Bau erst mal das entsprechende nackte HTML, ohne dich um Fromatierungsangaben zu kümmern. Dann können wir gemeinsam weitersehen.

Matthias

--
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Hebe und Heberden-Arthrose.