[Résolu] Plusieurs thèmes pour un site

Hello

Je cherche un moyen de gérer efficacement et proprement plusieurs thèmes d'un site. Le principe actuellement utilisé est simple, mais peu pratique quand il faut mettre à jour : 1 thème = 1 feuille de style énorme. Il y a, j'en suis sûr, moyen d'optimiser.

J'ai pensé à utiliser 2 feuilles de styles :
- une fixe,
- une alternative pour chaque thème.

Mais le problème c'est qu'une même balise va exister 2 fois, dans 2 feuilles de styles différentes...

Exemple :

fixe.css

body {
font-family:verdana;
margin:0;
padding:0; }

theme1.css

body {
background:url(../images/background_theme1.gif) no-repeat; }

Qu'en pensez-vous ? Je suis preneur si vous avez des liens sur le sujet
Modifié par BeliG (27 Apr 2007 - 10:35)

Sans vouloir m'avancer sur des détails techniques à ton sujet, observe l'architecture MVC:

Modèle-Vue-Contrôleur


Modifié par Yoyann (26 Apr 2007 - 14:42)

Euh...

J'pensais plus à des @import ou des feuilles de styles alternatives (rel="alternate stylesheet")

Si tu es bien organisé ca devrait pas poser de problème si une même balise est déclarée 2x. Il faut juste appeler d'abord ta feuille de style principale, puis ensuite l'alternative. Comme ça si une même propriété est déclarée 2x pour le même élément, c'est la déclaration de ta 2e feuille de style qui est prise en compte.

Note que dans ton exemple, puisque les 2 ne sont pas contradictoires, elles s'appliqueront toutes les 2.
Modifié par <nicolas> (26 Apr 2007 - 15:16)

Ok donc selon toi :

1°) 2 feuilles de styles permanentes

<link rel="stylesheet" type="text/css" href="fixe.css"/>
<link rel="stylesheet" type="text/css" href="theme1.css"/>

C'est ce que je pensais faire au début, mais depuis que j'ai lu ces deux articles je suis complétement perdu :

Feuilles de styles permanentes, alternatives et préférées
Plusieurs présentations alternatives pour votre site

D'autres solutions de ce type me viennent en tête :

2°) Feuille permanente + Feuille préférée (attribut title)

<link rel="stylesheet" type="text/css" href="fixe.css"/>
<link rel="stylesheet" type="text/css" href="theme1.css" title="theme1"/>

3°) Feuille permanente + Feuille alternative

<link rel="stylesheet" type="text/css" href="fixe.css"/>
<link rel="alternate stylesheet" type="text/css" href="theme1.css"/>

4°) Balise <style> + @import

<style type="text/css">
     @import url("theme1.css");
</style>

     et dans theme1.css :

@import url("fixe.css")
+ styles associés au theme1

5°) Importation via balise <link>

<link rel="stylesheet" type="text/css" href="theme1.css"/>

     et dans theme1.css :

@import url("fixe.css")
+ styles associés au theme1

Les solutions 4°) et 5°) se valent, et concernant la compatibilité des solutions 2°) et 3°) avec IE j'ai lu des choses se contredisant alors je sais pas...

J'hésite entre la solution 1°) et 4°), donc entre Link ou @import
Modifié par BeliG (26 Apr 2007 - 17:17)