Fork me on GitHub






H-hich
Assembler des feuilles de styles ensemble pour n'en former qu'une
#1
Régulier
Inscrit: 16/08/2006 03:07
Messages: 308
Bonjour,

Depuis quelques jour je me relance dans l'optimisation de mon theme basé sur Morpho et j'ai cette abondance de feuille de style qui m'agace énormement.

J'ai donc la feuille Style.css qui fait appel aux autres de cette façon :

/* include style sheets */  @import url(reset.css);          /* reset css for web browsers*/  @import url(baradmin.css);          /* administration access in footer */  @import url(globalnav.css);      /* horizontal menu in header */  @import url(homepage.css);          /* style for specific content in mainpage */  @import url(blocks.css);          /* style for blocks */  @import url(content.css);          /* style for content */  @import url(module.css);          /* style for content menu */  @import url(content-data.css);      /* style for files include in header or bottom page content */  @import url(socialbookmark.css); /* style for socialbookmark in end content zone */  @import url(blockfooter.css);      /* style for blocks in footer */  @import url(forms.css);          /* style for forms */  @import url(extras.css);          /* extras style for perzonalisation templates */  @import url(iconize.css);          /* style for icone in specific link */  @import url(tplsystem.css);      /* style for templates system : siteclosed, redirection, debug mode, core messages, ... */


J'ai commencé a me faire une nouvelle feuille reprenant toute ces feuilles. J'ai donc remplacer la ligne "@import url(reset.css);" par le contenu de reset.css (exactement a la place de la ligne de l'import, pour etre sur de conserver l'ordre des choses)

Logiquement, je devrais avoir le meme résultat à l'ecran ?! En realité rien qu'en modifiant la ligne reset.css tout mon contenu se decalle de partout.

Pouvez-vous me guider pour arranger cela ?

Posté le : 29/12/2010 01:44

Open in new window
hinsolite.com
Partager Twitter Partagez cette article sur GG+
Rapport Haut
aquaportail
Re: Assembler des feuilles de styles ensemble pour n'en former qu'une
#2
Régulier
Inscrit: 26/02/2007 16:00
Messages: 494
Bonjour,
de mémoire, les @import ne fonctionnent pas à l'intérieur d'un fichier CSS, seulement dans le head d'un fichier html. Et puis, de toute façon, la méthode est très très mauvaise : http://www.alsacreations.com/actu/lir ... tyle-css-import-link.html !!! En résumé, avec des @import, tu vas augmter le temps de chargement et il y a de grandes chances que tu obtiennes des résultats aléatoires dans l'affichage (les fichiers étant chargés dans n'importe quel ordre).

Ton souci peut être résolu en concaténant toutes les sources des différents fichiers dans un seul fichier. C'est plus propre.

Regarde le code source d'une de mes pages comme celle-ci (au hasard) : www.aquaportail.com/definition-2263-maladie-chronique.html
Il n'y a qu'un seul et unique fichier CSS (optimisé en plus).

Et avec diverses optimisations du code généré, les pages obtiennent un score > 93/100 au test Page Speed de Google.

Posté le : 29/12/2010 15:42

Portail en aquariophilie avec une passion pour le poisson clown en aquariums récifaux.
Partager Twitter Partagez cette article sur GG+
Rapport Haut
H-hich
Re: Assembler des feuilles de styles ensemble pour n'en former qu'une
#3
Régulier
Inscrit: 16/08/2006 03:07
Messages: 308
J'ai du mal m'exprimer

Je sais bien que de multiplier les feuilles n'est pas bon pour l'optimisation, c'est d'ailleurs pour cela que je veux les réunir en une seule.

Ce n'est pas moi qui ai fait toutes ces feuilles et les @import, c'etait de base dans le theme morpho sur lequel je me base.

Pour l'instant je pensais bien faire comme toi, virer tous les @import et tout réunir dans un seul fichier, mais le résultat est complétement différent entre ma version réuni des feuilles et la version en @import et je comprend pas pourquoi malheureusement

Posté le : 30/12/2010 01:31

Open in new window
hinsolite.com
Partager Twitter Partagez cette article sur GG+
Rapport Haut

 Haut   Précédent   Suivant



Vous pouvez voir les sujets.
Vous ne pouvez pas débuter de nouveaux sujets.
Vous ne pouvez pas répondre aux contributions.
Vous ne pouvez pas éditer vos contributions.
Vous ne pouvez pas effacez vos contributions.
Vous ne pouvez pas ajouter de nouveaux sondages.
Vous ne pouvez pas voter en sondage.
Vous ne pouvez pas attacher des fichiers à vos contributions.
Vous ne pouvez pas poster sans approbation.
Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

30 Personne(s) en ligne (24 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 30 | Plus ...