SlideShare une entreprise Scribd logo
1  sur  3
CSS mehrspaltige Layouts
links width : 14%; float : left; mitte float : left; width : 66%; margin-left : 3%; rechts width : 14%; float : right; Alle Breiten in Prozent css: #left, #right { width:14%; line-height:18px; background-color : silver; } #left { float:left; } #right { float:right; } #content { float:left; width:66%; margin-left:3%; } html: <div id=&quot;left&quot;> Linkes Menü </div> <div id=&quot;content&quot;> bla</div> <div id=&quot;right&quot;> Rechtes Menü </div>
Vorlagen http://intensivstation.ch/templates/ http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm http://www.glish.com/css/7.asp  (Spalten haben unterschiedliche Höhe) http://lists.econsultant.com/top-css-layouts-downloads-hacks-galleries-tricks.html http://blog.html.it/layoutgala/ http://www.positioniseverything.net/

Contenu connexe

Plus de lehrerfreund

CSS - Externes Stylesheet
CSS - Externes StylesheetCSS - Externes Stylesheet
CSS - Externes Stylesheet
lehrerfreund
 
PHP: Variablen entschaerfen
PHP: Variablen entschaerfenPHP: Variablen entschaerfen
PHP: Variablen entschaerfen
lehrerfreund
 
PHP: Indiziertes Array
PHP: Indiziertes ArrayPHP: Indiziertes Array
PHP: Indiziertes Array
lehrerfreund
 
PHP: Assoziative Arrays
PHP: Assoziative ArraysPHP: Assoziative Arrays
PHP: Assoziative Arrays
lehrerfreund
 
PHP: Rechnen mit PHP
PHP: Rechnen mit PHPPHP: Rechnen mit PHP
PHP: Rechnen mit PHP
lehrerfreund
 
PHP: br und n (new line)
PHP: br und n (new line)PHP: br und n (new line)
PHP: br und n (new line)
lehrerfreund
 
PHP: Variablen und Datentypen
PHP: Variablen und DatentypenPHP: Variablen und Datentypen
PHP: Variablen und Datentypen
lehrerfreund
 
PHP: echo, kommentare
PHP: echo, kommentarePHP: echo, kommentare
PHP: echo, kommentare
lehrerfreund
 
CSS: Eigene Stilklassen
CSS: Eigene StilklassenCSS: Eigene Stilklassen
CSS: Eigene Stilklassen
lehrerfreund
 
CSS: Rahmen und Hintergründe
CSS: Rahmen und HintergründeCSS: Rahmen und Hintergründe
CSS: Rahmen und Hintergründe
lehrerfreund
 
CSS: Listen formatieren
CSS: Listen formatierenCSS: Listen formatieren
CSS: Listen formatieren
lehrerfreund
 
CSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-BereichCSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-Bereich
lehrerfreund
 
CSS: Text horizontal ausrichten
CSS: Text horizontal ausrichtenCSS: Text horizontal ausrichten
CSS: Text horizontal ausrichten
lehrerfreund
 
CSS: Schrift formatieren
CSS: Schrift formatierenCSS: Schrift formatieren
CSS: Schrift formatieren
lehrerfreund
 

Plus de lehrerfreund (20)

CSS - Externes Stylesheet
CSS - Externes StylesheetCSS - Externes Stylesheet
CSS - Externes Stylesheet
 
PHP: foreach
PHP: foreachPHP: foreach
PHP: foreach
 
PHP: Switch
PHP: SwitchPHP: Switch
PHP: Switch
 
PHP: Variablen entschaerfen
PHP: Variablen entschaerfenPHP: Variablen entschaerfen
PHP: Variablen entschaerfen
 
PHP: exit
PHP: exitPHP: exit
PHP: exit
 
PHP: isset
PHP: issetPHP: isset
PHP: isset
 
PHP: if-else
PHP: if-elsePHP: if-else
PHP: if-else
 
PHP: Indiziertes Array
PHP: Indiziertes ArrayPHP: Indiziertes Array
PHP: Indiziertes Array
 
PHP: Assoziative Arrays
PHP: Assoziative ArraysPHP: Assoziative Arrays
PHP: Assoziative Arrays
 
PHP: Rechnen mit PHP
PHP: Rechnen mit PHPPHP: Rechnen mit PHP
PHP: Rechnen mit PHP
 
PHP: br und n (new line)
PHP: br und n (new line)PHP: br und n (new line)
PHP: br und n (new line)
 
PHP: Variablen und Datentypen
PHP: Variablen und DatentypenPHP: Variablen und Datentypen
PHP: Variablen und Datentypen
 
PHP: echo, kommentare
PHP: echo, kommentarePHP: echo, kommentare
PHP: echo, kommentare
 
CSS: div und span
CSS: div und spanCSS: div und span
CSS: div und span
 
CSS: Eigene Stilklassen
CSS: Eigene StilklassenCSS: Eigene Stilklassen
CSS: Eigene Stilklassen
 
CSS: Rahmen und Hintergründe
CSS: Rahmen und HintergründeCSS: Rahmen und Hintergründe
CSS: Rahmen und Hintergründe
 
CSS: Listen formatieren
CSS: Listen formatierenCSS: Listen formatieren
CSS: Listen formatieren
 
CSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-BereichCSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-Bereich
 
CSS: Text horizontal ausrichten
CSS: Text horizontal ausrichtenCSS: Text horizontal ausrichten
CSS: Text horizontal ausrichten
 
CSS: Schrift formatieren
CSS: Schrift formatierenCSS: Schrift formatieren
CSS: Schrift formatieren
 

CSS: Mehrspaltige Layouts

  • 2. links width : 14%; float : left; mitte float : left; width : 66%; margin-left : 3%; rechts width : 14%; float : right; Alle Breiten in Prozent css: #left, #right { width:14%; line-height:18px; background-color : silver; } #left { float:left; } #right { float:right; } #content { float:left; width:66%; margin-left:3%; } html: <div id=&quot;left&quot;> Linkes Menü </div> <div id=&quot;content&quot;> bla</div> <div id=&quot;right&quot;> Rechtes Menü </div>
  • 3. Vorlagen http://intensivstation.ch/templates/ http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm http://www.glish.com/css/7.asp (Spalten haben unterschiedliche Höhe) http://lists.econsultant.com/top-css-layouts-downloads-hacks-galleries-tricks.html http://blog.html.it/layoutgala/ http://www.positioniseverything.net/