[CSS]Best practise, in head of in file

[Roeligan]

Ik ben bezig om een blog te bouwen, hierin wil ik dat middels de admin de style is aan te passen. Oftewel link kleuren, font-family etc opslaan in DB. Nu is het makkelijk om in de layout file een CSS in de head te zetten met waardes uit de DB (piece of cake), nu is het echter zo dat de meeste werken met een css file (ik normaal ook). Wat is nu het voor-/nadeel van een aparte CSS file?

[Rowanov]

Voordeel van een aparte CSS file is dat je hem kan herbruiken op meerdere pagina's en dat hij gecached wordt. Je kan overigens gewoon een php file maken en hem op de volgende manier toevoegen:

HTML:

<link rel="stylesheet" href="sheet.php" type="text/css" media="screen">

Moet je er alleen voor zorgen dat je php script alles netjes er uit gooit

[RM-rf]

Roeligan schreef op vrijdag 01 juni 2007 @ 11:38:

Wat is nu het voor-/nadeel van een aparte CSS file?

a) voor de gebruiker kan die CSS file gecached worden en hoeft dan niet iedere keer herladen worden
b) voor de beheerder is het zo dat via een externe centraal CSS-bestand men via één bestand de styles over een hele site kan aanpassen.

[Roeligan]

Ik werk middels Fusebox in Coldfusion. In dit framewerk heb ik 1 layout file, als ik daarin de css prop, hoef ik dat ook maar op 1 plaats te doen, caching is wel een goed punt. Ik zal vanaaf Rowanov zijn manier eens proberen, daar had ik nog niet aan gedacht.

[Janoz]

Bijkomend voordeel is dat het makkelijker is om verschillende stylesheets voor verschillende media te definieren. Ik heb geen idee of dat met het inlinen van styles ook mogelijk is.

[Zerora]

Janoz schreef op vrijdag 01 juni 2007 @ 11:46:
Bijkomend voordeel is dat het makkelijker is om verschillende stylesheets voor verschillende media te definieren. Ik heb geen idee of dat met het inlinen van styles ook mogelijk is.

Je kunt in de css gewoon dit aangeven om voor verschillende media een opmaak te definieren:

code:

@media print {
    BODY { ... }
  }
@media screen {
    BODY { ... }
  }
@media screen, print {
    BODY { ... }
  }

Zie hier de verschillende mediatypes: [klik]

[ Voor 9% gewijzigd door Zerora op 01-06-2007 11:53 ]