[TYPO3-german] CSS Stylesheet Organisation
Andreas B.
ab at web157.webgo24-server11.de
Mon Mar 31 20:46:55 CEST 2008
Hallo zusammen,
hab da mal ne Frage. Mir ist aufgefallen, dass man ja doch sehr viel
Zeit damit verbringt die Seiten zu formatieren, und dass ich immer
wieder in diverse CSS-Dateien z.B. die gleichen Farben eintrage.
Mein Ansatz zur Optimierung war folgender, und ich würd gerne von euch
wissen, ob das so in Ordnung ist, oder ob es irgendwie einfacher geht.
Mein Metatag in der HTML-Datei sieht so aus:
<link rel="stylesheet" href="style.php" type="text/css">
also keine CSS- sondern eine PHP-Datei.
Damit das auch geht, steht in der style.php folgendes:
<?php
header("Content-type: text/css");
include "includes/style_conf.inc";
echo <<<EOT
/* Grundeinstellungen */
body {
font-family: $schriftart;
color: $font;
background: $back $back_body;
border: solid 10px $spot;
}
a {
color: $link;
}
/* to be continued */
EOT;
?>
Es wird in Zeile 3 also auch noch eine style_conf.inc includet, in
welcher die Standartwerte definiert sind. Sie sieht ungefähr so aus:
<?php
// Farben
$font = "#000000"; // Farbe Schrift
$back = "#ffffff"; // Farbe Hintergrund
$spot = "#ffff00"; // Farbe für Hervorgehobenes
$links = "#0000ff"; // Farbe für Links
$black = "#000000"; // Schwarz
$white = "#ffffff"; // Weiß
$error = "#ff0000"; // Fehlerfarbe
$even = "#999999"; // Gerade Zeilennummern
$odd = $back; // Ungerade Zeilennummern
// Hintergrundbilder
$back_body = "url(_pics/back_body.gif) no-repeat;";
$back_menu = "url(_pics/back_menu.gif) no-repeat;";
$back_header = "url(_pics/back_header.gif) no-repeat;";
$back_content = "url(_pics/back_content.gif) no-repeat;";
$back_footer = "url(_pics/back_footer.gif) no-repeat;";
$back_guestbook = "url(_pics/back_guestbook.gif) repeat-x;";
// Sonstiges
$schriftart = "Verdana, Arial, Helvetica, sans-serif";
?>
Man könnte in dieser Datei sogar noch Browserweichen einbauen wie z.B.
folgende, wo allen IEs kleiner als 7, GIFs anstelle von PNGs geliefert
werden.
$png = ".png"; // normale Dateiendung
$browser = $_SERVER['HTTP_USER_AGENT'];
$start = stripos($browser, "MSIE ");
$browser = $start ? substr($browser, $start+5, 1) : 999;
if($browser < 7) {
$png = ".gif"; // Dateiendung für IE<7 gleich .gif
}
Nun kann ich durch Änderungen in dieser style_conf.inc mit einem Schlag
die einzelnen Farben des gesammten Projekts bearbeiten. Dieses Konzept
habe ich in älteren Projekten von mir angewendet und es hat sich
wirklich bewährt, die Frage für mich ist jetzt, da ich jetzt an meinem
ersten Typo3 Projekt arbeite: Macht das mit Typo3 Sinn, geht das, oder
geht es sogar einfacher.
Gruß Andreas
More information about the TYPO3-german
mailing list