Inhaltsverzeichnis

CSS

CSS

CSS ist heute die Standard-Stylesheetsprache (d.h. Desginvorlagesprache) für das Web. Es ermöglicht eine Trennung des Layouts von anderen Elementen (Inhalt, Programmierung).

Einbindungsmöglichkeiten: Formatanweisungen können per
1. Browser-Standard
2. Externem style sheet (.css-Datei <link rel="stylesheet" media="screen" type="text/css" href="/wiki/lib/exe/css.php" />
3. Internes style sheet (innerhalb des <head> tags)
4. Inline (innerhalb eines HTML-Elements): höchste Priorität
Bausteine
- Element (zeigt auf einen html-Tag z.B. kann man dem <p>-Tag mit z.B. p { margin-left: 100px; } gibt allen <p>-tags einen (100-Pixel) linken Einzug.
- wiederverwendbare class die Anweisung .name{Formatanweisungen} gibt allen <div class=„name“> oder <em class=„name“> die Formatanweisungen
- Id arbeitet wie die Klasse, darf aber nur einmal verwendet werden. z.B. <div id=„footer“> bekommt die Formatanweisungen aus #footer{Formatanweisungen}

Links

Cascading Style Sheets, Level 2
53 CSS-Techniques you couldn´t live without
CSS Tutorial
CSS 4 you
Selfhtml zu CSS
Beginners guide to CSS and standards
How to structure large CSS files
deutschsprachige CSS-Referenz
W3 CSS-Validator
Selfhtml Validator
CSSZenGarden - überzeugende CSS-Demonstration: eine Seite in 350 Designs betrachten durch einen sog. "Style Switcher".
HTML to CSS: Center the page vertically and horizontally
a methodic to css coding: four bubbles model
Optimize browser rendering
Media Queries von CSS3 - Selektion von Stylesheets je nach Anzeigegerät

CSS-Bugs und workarounds

CSS-Templates

Dynamische basis und Freeflux CSS TEMPLATES
Perfect multi-column CSS liquid layouts - iPhone compatible - The Perfect 3 Column Liquid Layout (hab ich für die Seite verwendet)
Free CSS Layouts - Download
Fixed width CSS Layout Fixed width CSS Layout #2

CSS-Menus

CSS Frameworks

Yaml

Yaml (Yet Another Multicolumn Layout) ist ein (X)HTML/CSS-Framework.

Robuste & Flexible Layouts einfach erstellen Joomla! Template basierend auf dem YAML CSS-Framework YAML in der Praxis einsetzen

YAML und Typo3

Boxen mit (abgerundeten) Ecken

Snazzy Borders
Rounded corners and shadowed boxes: Beispiel mit 5 Grafiken und recht Menu das stehen bleibt (ohne Frames).
Nifty Corners

Farbverläufe mit CSS

CSS Gradient Generator

Tabellen

Style tables with CSS

Aufzählungen

Listenformatierung incl. Aufzählungszeichen