CSS3 - gewusst wie
Veröffentlichungsdatum: 13. März 2012
Änderungsdatum: 24. Januar 2014
css css3 gradient shadow box border background
CSS3 für unterschiedliche Browser schnell und einfach einsetzen.
Mit CSS3 können Sie Effekte, wie z.B. Schatten, runde Ecken oder Farbverläufe sehr viel einfacher als bisher umsetzen. Unser Dev-Blog-Artikel beschreibt die technischen Details hierzu genauer.
Mühsame Umsetzungen mit Bilder entfallen so. Um die verschiedenen Browser zu unterstützen, gibt es von CSS3 PIE ein .htc Skript speziell für die älteren Internet-Explorer. Somit sind dann praktisch alle relevanten Browser in der Lage diese CSS3 Effekte darzustellen.
Die aktuelle BASE ist bereits so umgesetzt, dass Sie optional das automatische Generieren der browserspezifischen CSS3-Varianten aktivieren können. Setzen Sie hierzu die Werte für "CSS3 Definitionen automatisch generieren" und "CSS3Pie nutzen" auf "Ja":
Diese Werte werden in der aktuellen BASE bereits dynamisch in das erforderliche WSL-Tag eingelesen.
Nachfolgend beispielhaft ein Aufruf aus der includes.global.php des BASE-Projektes:
Beispiel: Auszug aus der Datei /[IHR-LAYOUT-PROJEKT]/wGlobal/layout/templates/misc/includes.global.php
...
<!-- In den Elementen der aktuellen Seite benötigte und dynamisch registrierte CSS-Dateien einbinden -->
<wsl:includeCssRessources dirMerged="{$wGlobalProjectPath}/wGlobal/layout/styles/merged" dirOptimized="{$wGlobalProjectPath}/wGlobal/layout/styles/optimized" merge="{php:functionString('wVariables::getValue', 'css_merge', $wGlobalProjectPath)}" minimize="{php:functionString('wVariables::getValue', 'css_minimize', $wGlobalProjectPath)}" generateCSS3="{php:functionString('wVariables::getValue', 'css_generateCSS3', $wGlobalProjectPath)}" pathCSS3Pie="{php:functionString('wVariables::getValue', 'css_pathCSS3PIE', $wGlobalProjectPath)}" generateDataURL="{php:functionString('wVariables::getValue', 'css_generateDataURL', $wGlobalProjectPath)}" interpreteWCSS="1" interpreteServerSideWCSS="1"/>
...Weblication® CMS nimmt Ihnen durch das automatische Generieren der browserspezifischen CSS3 Varianten viel Arbeit ab. Gerade hinsichtlich der Unterstützung von älteren Internet Explorer Versionen (7 und 8) verfügen Sie mit CSS3 PIE über eine Open Source Anwendung, die Ihnen manuelle Abfragen auf diese Browserversionen erspart. Beachten Sie aber hierzu bitte die Hinweise weiter unten! Speziell bei relativen Pfadangaben in CSS-Dateien finden Sie im CSS3 PIE Forum einige Problemlösungen.
Wichtige Hinweise
- Wir können keinen Support und Gewährleistung für die externe Anwendung CSS3 PIE leisten!
- Bei Problemen zu Umsetzungen mit CSS3 PIE konsultieren Sie bitte das CSS3 PIE Forum.