CSS deja creer comment sans servir?

Bonjour à tous , je recherche une aide pour mieux comprendre les css.
Mon probleme est le suivant est il fesable de creer une support visuel d'une page existante css . Je prend mon cas j'ai mon fichier css creer comment je fais pour voir son résultat dans une page html ? lorsque je copie colle le code css dans une page vierge html rien n'apparais dans la page au final comment faire et est ce que c'est possible? Merci d'avance pour votre aide ou vos conseils.

Salut,

Pour appeler une feuille de style contenue dans un fichier CSS, il suffit d'utiliser soit l'élément HTML link soit l'élément HTML style contenant la règle @import.

Une petite recherche sur le site te donnerait probablement, entre autres résultats, cette astuce.

Soit dit en passant, si la page HTML ne comporte aucun contenu, il est normal que ça ne fonctionne pas (sauf si, par exemple, tu as déclaré une couleur d'arrière-plan au niveau des éléments html ou body).

Merci de votre réponse , mais auriez vous une idée de comment proceder pour réutiliser des pages existantes tpl et recréer un css ? De mon coter j'arrive a m'anipuler les css dans une creation directe dans une page html ou en appelant un css externe mais je ne comprend pas comment relier ma creation graphique decouper sous firework et assembler avec mes pages existantes tpl .

cybtel a écrit :
De mon coter j'arrive a m'anipuler les css dans une creation directe dans une page html ou en appelant un css externe mais je ne comprend pas comment relier ma creation graphique decouper sous firework et assembler avec mes pages existantes tpl .

Pourrais-tu reformuler ta dernière phrase, car elle n'est pas très claire ?

Édit : Je viens de remarquer que tu as posé cette dernière question ici. Si tu peux éviter les doublons...
Modifié par Victor BRITO (25 Mar 2010 - 10:09)

Désoler c'est tellement confut les templates comparez a une simple page html avec css integrer ou externe que je comprend déjà.
Mon probléme est le suivant j'ai installer une boutique prestashop qui est livrée avec un théme par défault .
Ce théme contient des pages tpl , et des dossier ,1 images ,1 css , 1 js ,..
J'ai recreer avec firework mon nouveau graphique que j'ai découper pour avoir les zones qui correspondes a mes block tpl comment arriver a creer avec mon css firework le lien avec mes pages tpl ?
Exemple avoir la barre de recherche a l'endroit ou j'ai dessiner dans firework l'espace de celle ci ou le menu a tel endroit precis ?
En html je me sert des calques mais la pour les templates je comprend pas comment relier tout ca??

Salut,

Ton problème est tellement mal expliqué qu'il est difficile d'y répondre... De ce que je comprends :

Tu as d'un coté un fichier template d'une page html.
De l'autre tu as une feuille de style que tu aimerais appliquer à ton template.

Mais d'où sort cette feuille de style ? Elle existait à l'origine pour un tout autre site ?
Pour qu'elle fonctionne avec ton template, il faut que les sélecteurs qui servent à déterminer les différents styles correspondent avec ceux qui sont présent dans le code html du template et des éléments générés par le cms.

Par exemple, si ta page fais appel à un #contenudroit p {} mais que cet identifiant n'est pas présent dans le template, les styles ne seront tout simplement pas appliqués.

Donc tu peux, soit refaire la feuille de style pour que les identifiants correspondent au code html existant, soit adapter le template, au choix.

Mais poser une feuille html et un fichier css sans corrélation ne fonctionne en revanche pas.
Modifié par Mikachu (25 Mar 2010 - 10:30)

C'est plus simple de trouver tes sélecteurs à partir du code généré. Les templates ne sont qu'une toute petite partie structurelle destinée à héberger les informations de la page, mais le code lié au contenu se trouve dans divers petits fichiers de scripts en php qu'il est plus difficile de visualiser.

Bonjour,

Je viens de trouver cette explication, sommaire mais efficace, de ce qu'est prestashop (où tu trouverais d'ailleurs un meilleur support )

Forum prestashop a écrit :
Prestashop est construit sous la forme d’un MVC (modèle vue contrôleur) ce qui permet de séparer le code du design. Ainsi le php c’est le code, le tpl c’est la structure et le css c’est le design.
Donc le css est séparé du reste pour pouvoir justement le gérer facilement, tout est dans le même fichier global.css de ton thème

Si tu ne changes pas la structure de tes pages, tu ne touches pas aux fichiers templates (.tpl)
Dans ces fichiers tpl, tes blocs sont identifiés par soit des identifiants (id="truc", que tu retrouves dans ta feuille de styles avec ce symbole : "# {propriétés;}) ou des classes (class="machin" ,que tu retrouves dans ta feuille de styles avec ce symbole : ".{propriétés;}")
Ce sont ces propriétés définies dans la feuille de styles que tu dois modifier, ie remplacer le nom des images par défaut par les tiennes (celles que tu auras construites et découpées sous Fireworks), positionner ces blocs à ta convenance, gérer les marges et les espacements, etc...

Si tu ne sais pas comment faire, je te renvoie aux suggestions de l'ami Kachu ( ) ou vers les tutoriels que te propose Alsacreations : http://www.alsacreations.com/tutoriels/ (notamment la partie css) et plus particulièrement le Guide de survie du positionnement CSS

Très cordialement,
Sylvain
Modifié par 6l20 (25 Mar 2010 - 14:56)

Merci pour les liens je crois que je vais encore relire ces sites ou je suis déjà aller plusieurs fois .Merci beaucoup a tous ce qui ont répondu si rapidement.

pour trouver les fichiers CSS qui agissent sur la page que tu souhaite modifier, tu peux déjà tous les désactiver (ajoute un signe _ devant les noms des fichiers .css) et réactive-les un par un.

Lol, je sait c'est bricolage, mais comme tu débutes je suis sûr que ça va t'apprendre plein de choses utiles en passant !