<style type="text/css">
#beschreibung {
background:url('BILDADRESSE') fixed;
padding: 3em 1em;
}
#beschreibung a {
color: #4C000E;
}
#beschreibung a: visited {
color: #4C000E;
}
#beschreibung a:hover {
color: #aa0000;
}
#beschreibung h1 {
font: bold 2.7em Comic Sans MS;
color: #00347D;
text-align: center;
}
#beschreibung h2 {
font: bold 1.4em Comic Sans MS;
color: #00347D;
padding-left: 45px;
}
#beschreibung table {
width: 96%;
text-align: center;
margin: auto;
}
#beschreibung td {
width: 50%;
}
#beschreibung td.border {
padding: 30px 10px;
border:7px solid #00347D;
}
#beschreibung td.text {
border:3px solid #00347D;
text-align: left;
font: 1.2em Arial;
color: #00347D;
padding: 30px;
background: #C0D0DF;
}
#beschreibung img {
border: 3px solid #CA0300;
}
#beschreibung #info {
text-align: left;
background:#C0D0DF;
border: 6px double #CA0300;
font: 1.2em Arial;
color: #00347D;
margin: 20px auto;
}
#beschreibung .left {
padding-left: 50px;
}
#beschreibung .red {
color: #a00;
}
#beschreibung .angebot {
font-style: italic;
color: #777;
}
#beschreibung .angebot a,
#beschreibung .angebot a:visited {
color: #777;
}
#beschreibung .angebot a:hover {
color: #a00;
}
</style>

<div id="beschreibung">

<!-- ===== ÜBERSCHRIFT: Code Anfang ====== -->
<h1>Artikelbeschreibung</h1>
<!-- ====== ÜBERSCHRIFT: Code Ende ==== -->


<!-- ====== ANFANG TABELLE 1 ====== -->
<table>
<tr>
<!-- ===== Bild1 links: Code Anfang ==== -->
<td class="border"><img src="BILDADRESSE" alt="ALTERNATIVTEXT"></td>
<!-- ==== Bild1 links: Code Ende ==== -->

<!-- == rechter Text zu Bild1: Code Anfang == -->
<td class="text"><h2>Beispieltext</h2>
<ul>
<li>ein schönes altes Erbstück:
<br>hölzernes Schaukelpferd</li>
<li>Text Text Text Text Text Text Text Text Text </li>
<li>Text Text Text Text Text</li>
<li>Text Text Text Text</li>
</ul>
</td>
<!-- == rechter Text zu Bild1: Code Ende == -->
</tr>
</table>
<!-- ====== ENDE TABELLE 1 ====== -->

<br>

<!-- ====== ANFANG TABELLE 2 ====== -->
<table>
<tr>
<!-- == linker Text zu Bild2: Code Anfang == -->
<td class="text"><h2>Detail: Pferdekopf</h2></td>
<!-- == linker Text zu Bild2: Code Ende == -->

<!-- ===== Bild2 rechts: Code Anfang ==== -->
<td class="border"><img src="BILDADRESSE" alt="ALTERNATIVTEXT"></td>
<!-- ==== Bild2 rechts: Code Ende ==== -->
</tr>
</table>
<!-- ====== ENDE TABELLE 2 ====== -->

<br>

<!-- ====== ANFANG TABELLE 3 ====== -->
<table>
<tr>
<!-- ===== Bild3 links: Code Anfang ==== -->
<td class="border"><img src="BILDADRESSE" alt="ALTERNATIVTEXT"></td>
<!-- ==== Bild3 links: Code Ende ==== -->

<!-- == rechter Text zu Bild3: Code Anfang == -->
<td class="text"><h2>Detail: Pferdeschwanz</h2>
<p class="left">Text Text Text
<br>Text Text Text
<br>Text Text
<br>Text Text Text
</td>
<!-- == rechter Text zu Bild3: Code Ende == -->
</tr>
</table>
<!-- ====== ENDE TABELLE 3 ====== -->


<!-- ====== ANFANG TABELLE 4 - TEXT unter den Tabellen ====== -->
<table id="info">
<tr><td style="padding: 30px;">
<p><span class="red">Versand:</span> Hermespaket ... EUR trägt Käufer -
bei besonderen Versandwünschen bitte <a href="mailto:deine_mail-adresse@xyz">email</a>-Kontakt</p>
<p><span class="red">Privatverkauf</span> - daher keine Rücknahme oder Gewährleistung</p>
<p class="angebot">Interessieren Dich auch meine anderen <a href="http://search.ebay.de/_W0QQsassZDEIN_EBAY_NAME"> Angebote</a> ? <span style="font-size:0.8em;">- vielleicht läßt sich Porto sparen :-)</span> </td></tr>
</table>
<!-- =========== ENDE TABELLE 4 - TEXT =========== -->

</div><!--beschreibung-->