beam1

Startseite

So sieht fett gedruckter Text aus.
So sieht kursiv gedruckter Text aus.
So sieht unterstrichener Text aus.
So sieht durchgestrichener Text aus.
Markiere diesen Text und die Hintergrundfarbe ändert sich.
Natürlich nur im Firefox.

Du möchtest dieses Layout haben?

1. Logge dich auf homepage-baukasten.de ein oder erstelle dort einen neuen Account.
2. Klicke auf 'Design einstellen' und wähle das 'CSS-Design'.
3. Kopiere folgende Codes in die jeweiligen Kästen bei 'Erweiterte Einstellungen'.
Text unter dem Design:
<div style="position: absolute; width: 253px; height: 450px; left: 150px ; top: 650px "> <div class=box><p class="menu_ueberschrift">Navi-Überschrift 1</p> <table id="table1" width="100%" border="0"><tbody> <tr valign="top"> <td style="width: 50%"> <a href="http://MENÜPUNKT1.de" _fcksavedurl="http://MENÜPUNKT1.de" class="navi">Menüpunkt 1</a> <a href="http://MENÜPUNKT2.de" _fcksavedurl="http://MENÜPUNKT2.de" class="navi">Menüpunkt 2</a> <a href="http://MENÜPUNKT3.de" _fcksavedurl="http://MENÜPUNKT3.de" class="navi">Menüpunkt 3</a> <a href="http://MENÜPUNKT4.de" _fcksavedurl="http://MENÜPUNKT4.de" class="navi">Menüpunkt 4</a> </td> <td> <a href="http://MENÜPUNKT5.de" _fcksavedurl="http://MENÜPUNKT5.de" class="navi">Menüpunkt 5</a> <a href="http://MENÜPUNKT6.de" _fcksavedurl="http://MENÜPUNKT6.de" class="navi">Menüpunkt 6</a> <a href="http://MENÜPUNKT7.de" _fcksavedurl="http://MENÜPUNKT7.de" class="navi">Menüpunkt 7</a> <a href="http://MENÜPUNKT8.de" _fcksavedurl="http://MENÜPUNKT8.de" class="navi">Menüpunkt 8</a> </td> </tr> </div> </tbody></table> <div class=box><p class="menu_ueberschrift">Navi-Überschrift 2</p> <table id="table1" width="100%" border="0"><tbody> <tr valign="top"> <td style="width: 50%"> <a href="http://MENÜPUNKT1.de" _fcksavedurl="http://MENÜPUNKT1.de" class="navi">Menüpunkt 1</a> <a href="http://MENÜPUNKT2.de" _fcksavedurl="http://MENÜPUNKT2.de" class="navi">Menüpunkt 2</a> <a href="http://MENÜPUNKT3.de" _fcksavedurl="http://MENÜPUNKT3.de" class="navi">Menüpunkt 3</a> <a href="http://MENÜPUNKT4.de" _fcksavedurl="http://MENÜPUNKT4.de" class="navi">Menüpunkt 4</a> </td> <td> <a href="http://MENÜPUNKT5.de" _fcksavedurl="http://MENÜPUNKT5.de" class="navi">Menüpunkt 5</a> <a href="http://MENÜPUNKT6.de" _fcksavedurl="http://MENÜPUNKT6.de" class="navi">Menüpunkt 6</a> <a href="http://MENÜPUNKT7.de" _fcksavedurl="http://MENÜPUNKT7.de" class="navi">Menüpunkt 7</a> <a href="http://MENÜPUNKT8.de" _fcksavedurl="http://MENÜPUNKT8.de" class="navi">Menüpunkt 8</a> </td> </tr> </div> </tbody></table> <div class=box><p class="menu_ueberschrift">Credits</p> <table id="table1" width="100%" border="0"><tbody> <tr valign="top"> <td style="width: 100%"> <a href="http://www.beautiiful-desiign.de.tl/" _fcksavedurl="http://www.beautiiful-desiign.de.tl/" class="navi">Layout: Beautiiful-Desiign</a> </td> </tr> </div> </tbody></table>

CSS-Code ohne Style-Tags:
body { overflow-x: hidden; background-repeat:no-repeat; background-image: url(http://s3.directupload.net/images/100507/c4k35i5i.png); background-color: #ffffff; } #content { position: absolute; left:445px; top:190px; width:535px; font-family:arial; font-size:11px; color: #282828; letter-spacing:0px; text-shadow: #c0c0c0 0px 1px 0px;} #header { display:none;} #nav_container { display:none;} #counter { display:none;} .menu_ueberschrift { display: block; font-family:arial; font-size: 18pt; color: #93683d; text-decoration: bold; margin-bottom: 10px; margin-right: 2px; line-height: 5pt; text-align: center; letter-spacing: -2px; border-right: 0px solid #ffffff;} A.navi:link, A.navi:active, A.navi:visited { display: block; font-family: tahoma; font-size: 10px; background-color: #93683d; margin-bottom: 2px; border-bottom: 0px dotted #FFFFFF; border-left: 0px solid #FFFFFF; border-top: 0px dotted #FFFFFF; border-right: 0px solid #FFFFFF; letter-spacing: 1px; color: #FFFFFF; text-transform: uppercase; text-align: center; line-height: 14px;} A.navi:hover { display: block; font-family: tahoma; font-size: 10px; background-color: #e1ab77; margin-bottom: 2px; border-bottom: 0px dotted #FFFFF; border-left: 0px solid #FFFFF; border-right: 0px solid #FFFFF; border-top: 0px dotted #FFFFF; letter-spacing: 1px; text-align: center; color: #FFFFFF; line-height: 14px;} a:link, a:visited a:active { color:#723813; text-decoration: none; } a:hover { color:#e1ab77; text-decoration: none; } ::-moz-selection { background: #b77a3f; }

4. Speichere ab - und schon hast du dein eigenes Layout!
5. Denke daran, uns bei den Credits zu verlinken! :]

Danke für's benutzen!

Hinweis: Die Credits in der Navigation müssen bleiben!