Un super CSS qui écrase tous les autres

Version imprimable

28/09/2011, 16h25
kahya

Un super CSS qui écrase tous les autres

Bonjour!

Voilà ma question : j'ai plusieurs appli qui ont chacune leur feuilles CSS.
Toutes ces appli utilisent le même header.html.

Je voudrais refondre complètement le style de mes applis, et donc avoir seulement 2 ou 3 fichiers CSS pour l'ensemble de mes applis : ces fichiers seraient commun à toute mes applis.

Le problème c'est que comme ces applis utilisent chacune leur CSS propre, il faudrait que je modifie chaque appli, au moins pour effacer l'appel à leur propre CSS, ce qui entraine une réinstall de chaque appli.

Est-ce qu'il existerai un moyen à votre connaissance d'appeler une CSS dans mon header et de dire "ne tenir compte que de cette CSS et pas de celles appelées en dessous" ?

Merci :)

Bonjour,

Citation:

Envoyé par kahya

Est-ce qu'il existerai un moyen à votre connaissance d'appeler une CSS dans mon header et de dire "ne tenir compte que de cette CSS et pas de celles appelées en dessous" ?

il te suffit de mettre en dernier celui qui est le plus important, les données étant lues de façon séquentielle la dernière propriété initialisée écrase la(es) précédente(s)
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>[...]</title> <style type="text/css"> p { color : red;} p { color : blue;} </style> </head> <body> <p> texte</p> </body> </html>
inverse les deux lignes dans la partie STYLE pour voir l'effet.

29/09/2011, 10h04
kahya

Bonjour,

Merci pour ta réponse mais en fait justement comme le header est inclu en début de mes pages générées je ne peux pas faire cela puisque les autres css sont inclues par chaque appli, donc en dessous du header, c'est justement mon problème :)

dans ce cas il faut voir du coté de la spécificité des sélecteur.
En gros...
...dans l'exemple suivant la couleur bleu est ignorée...
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>[...]</title> <style type="text/css"> #page p { color : red; } p { color : blue; } </style> </head> <body> <div id="page"> <p>Texte en BLEU enfin presque...</p> </div> </body> </html>
#page p -> 101
p       -> 001
tu peux peut être en tirer avantage si tu peux englober tes applis dans un conteneur.

29/09/2011, 18h18
Candygirl

En plus jouer sur la spécificité du sélecteur, comme proposé ci-dessus (j'ai remis le lien pour pointer sur les recommandation 2.1 plutôt que la 2 ;)), tu peux regarder du côté de la règle !important.
29/09/2011, 18h24
NoSmoking

Citation:

Envoyé par Candygirl

En plus jouer sur la spécificité du sélecteur, comme proposé ci-dessus (j'ai remis le lien pour pointer sur les recommandation 2.1 plutôt que la 2 ;))

il serait temps que je mette mes favoris à jour :aie: