Pixxen - Designs, Tutorials & more

cssvorlage 1

Dies ist eine schlichte Vorlage. Das CSS darf komplett verändert werden und kann dementsprechend für alles angepasst werden.

Text über dem Design:
<div id="wrapper">
Text unter dem Design:
<div id="footer"></div> </div>
CSS Code ohne Style-Tags:
@charset "utf-8"; /* CSS Document */ * {margin-left:auto; margin-right:auto;} /* Zentriert die Website */ body { font-family:Verdana, Geneva, sans-serif; /* Gibt die Schrift im Design an */ } #wrapper { width:800px; /* Gibt die Breite des Designs an */ border:1px solid #000; /* Erzeugt einen Rand */ } #header_container { width:599px; /* Gibt die Breite des Headers an */ height:150px; /* Gibt die Höhe des Headers an */ background-color:#666; /* Gibt die Hintergrundfarbe an */ float:left; /* Setzt den Header nach links */ border-bottom:1px solid #000; /* Erzeugt einen Rand untem am Header */ } #nav_container { width:200px; /* Gibt die Breite der Navigation an */ height:150px; /* Gibt die Höhe der Navigation an */ background:#999; /* Gibt die Hintergrundfarbe der Navigation an */ float:left; /* Setzt die Navigation neben den Header */ border-left:1px solid #000; /* Erzeugt einen Rand links */ border-bottom:1px solid #000; /* Erzeugt einen Rand unten */ } ul#nav { list-style-type:none; /* Versteckt die Listenpunkte */ display:inline; /* Setzt die Navigation in eine Linie */ } ul#nav li { border-bottom:1px solid #000; /* Erzeugt einen Rand unten */ height:25px; /* Gibt die Höhe der Menüpunkte an */ text-align:center; /* Zentriert den Text */ line-height:25px; /* Setzt den Text in die Mitte */ } ul#nav li a { font-size:18px; /* Gibt die Größe des Textes an */ text-decoration:none; /* Keine Textdekoration wie unterstrichen etc. */ color:#000; /* Gibt die Textfarbe an */ } #content_container { width: auto; /* Setzt automatisch die Breite */ background:#FFF; /* Gibt die Hintergrundfarbe an */ padding: 5px 10px 5px 10px; /* Gibt den Abstand an, erst Oben, Rechts, Unten und dann Links */ } #footer { width:auto; /* Gibt automatisch die Breite an */ height:30px; /* Gibt die Höhe des Footers an */ background: #666; /* Gibt die Hintergrundfarbe des Footers an */ border-top:1px solid #000; /* Erzeugt unten einen Rand */ } h1#header {color: #fff; padding-left: 1.2em;} /* Ändert den Titel im Header */ #counter {display: none;} /* Versteckt den Counter */ #post_content {clear:both;} #nav_heading {display:none;} #nav li.subpage {background:#808080;}