les CSS à la portée de tout le monde ! Wednesday 01 March 2006, 10:25:18 Donc comme promis à Alaiya, voici un piti topic pour se lancer dans les css le plus simplement possible...Tout d'abord il y a ici un bon tutorial :http://pompage.net/pompe/cssdezero-1/ensuite, il faut télécharger un éditeur css, si possible un éditeur avec aperçu immédiat du rendu des css en cours de création...en voici quelques uns : http://www.allhtml.com/telechargement/categorie2.phpje conseille d'en tester plusieurs, afin de bien comprendre le principe de fonctionnement, et d'être à l'aise avec...ensuite le mieux est de se faire une page d'essai, contenant par exemple un tableau avec du texte, un titre, un paragraphe de texte...Puis on créera la feuille de style, qu'on attachera à la page de test, et on pourra voir les modifications de la feuille de style sur celle-ci ! voilà, j'attends tes questions maintenant Al' !! Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #1 – Wednesday 01 March 2006, 10:51:47 Yeeeeaahhhh!!!! Merci Glaz'!^^ (ça a du bon de se croiser sur WoW, sérieux...) Je vais lire tout ça à tête reposée ce soir. Déjà, j'ai lu la première page du tutoriel, et a priori, j'ai... tout compris. (alors c'est donc ça la signification du que je voyais sur le code source de cette fichue page qui veut jamais faire la même chose... )Juste une question: est ce qu'il n'y a pas un déjà éditeur css dans NVu? Parce que, dans la rubrique "outils", il y a "Editeur css". Mais honnêtement, quand je clique dessus... je ne vois pas bien ce qu'il faut y faire. Enfin, si, je vois à quoi ça sert, j'ai vaguement tripatouillé, mais à vrai dire, je ne sais pas où ça s'enregistre, comment on s'en sert, ni même comment on voit ce qu'on fait... bref. Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #2 – Wednesday 01 March 2006, 11:12:53 sisi, il y en a un , mais je pense que pour débuter, il est mieux d'utiliser un piti programme dédié plutôt qu'un all-in-one !! TopstyleLite est plutôt facile à utiliser, et propose un aperçu direct des styles , ce qui est plutôt chouette par contre j'installerai Nvu ce soir aussi, je connais pas bien son principe de fonctionnement encore ! (pis on peut toujours faire un ou deux trucs en simultané via msn, je prends pas grand chose comme honoraires !!! )Quote(ça a du bon de se croiser sur WoW, sérieux...) faut aimer la bouffe cramée !! Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #3 – Wednesday 01 March 2006, 11:43:17 la question bête du jour : c'est quoi le "css" ? Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #4 – Wednesday 01 March 2006, 11:56:45 feuilles de style en cascade, en gros c'est une page de code très simple ou y'a écrit des stylesex : le style grasbleuben figure toi qu'on va déclarer dans le code que le texte est gras et bleu !! comme ça dans les pages internet qui font appel à cette feuille de style, on dira pas à cahque fois ce texte est gras et bleu, mais on appliquera le style directement...L'intérêt ? Ben là j'ai fait simple avec un style grasbleu, mais on peut faire plein de choses, ajuster des images, du texte, faire plein d'effets visuels...Et ensuite , vu qu'on applique les styles, on gagne beaucoup de poids pour les pages internet, et donc on gagne en rapidité et en lisibilité, et pis si on veut modifier un style, ben on le modifie directement dans la feuilel de style, et les modifications sont appliquées à toutes els pages d'un coup ! vouala un bon site pour voir des exemples aussi :www.alsacreations.com Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #5 – Wednesday 01 March 2006, 12:06:44 QuoteL'intérêt ? Ben là j'ai fait simple avec un style grasbleu, mais on peut faire plein de choses, ajuster des images, du texte, faire plein d'effets visuels...Et ensuite , vu qu'on applique les styles, on gagne beaucoup de poids pour les pages internet, et donc on gagne en rapidité et en lisibilité, et pis si on veut modifier un style, ben on le modifie directement dans la feuilel de style, et les modifications sont appliquées à toutes els pages d'un coup ! vouala Quand c'est dit comme ça ça a l'air simple, mais siiiiiimmple... Question con: imaginons, j'ai fait une page. Je sais que cette page, je vais devoir la dupliquer X fois du point de vue de la forme, il n'y a que le texte qui change (et les liens), tout le reste ne doit PAS bouger. Si je copie-colle le code source de cette page pour les prochaines, ça marche non? (comment ça c'est du bricolage de bas étage?!^^)Et alors, imaginons que je fasse ça. Bon, j'ai ma mise en forme. Maintenant, je dois changer le texte sur cette nouvelle page. Si je copie colle le texte à partir de word pour aller dans le pavé code source, est ce que ledit éditeur va lui même mettre les par exemple, à chaque endroit où j'ai un "entrée" dans mon texte sous word?Je sais pas si je suis très claire là... Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #6 – Wednesday 01 March 2006, 12:15:00 Je ne sais pas si j'ai bien pigé ta demande, mais l'intérêt du css, c'est entre autre de créer un fichier unique css qui centralise tout ce qui concerne la forme et qui va donner le style à toutes les pages de ton site, le contenu.De cette manière, si par exemple tu veux un jour changer la couleur de texte de toutes les pages de ton site, tu n'auras qu'à trifouiller le code de ton fichier css et hop ! Toutes les pages de ton site auront leur couleur de texte changée.Tu n'auras pas à passer sur chaque page de ton site.(bon, là, c'est simplifié à l'extrême, hein ) Quote Selected Last Edit: Wednesday 01 March 2006, 12:23:50 by FinalBahamut
Re : les CSS à la portée de tout le monde ! Reply #7 – Wednesday 01 March 2006, 13:53:48 en fait il y a des programmes qui permettent de retranscrire en format html une mise en forme de texte, si tu veux gagner du temps...Si vraiment tu veux faire comme ça je te trouverai ce prog, mais tu vas voir ça n'est vraiment pas indispensable !!!Pour ce qui est de copier coller le code source, non ce n'est pas la peine, si tu fais ça tu auras toujours la même page !! Non, il suffit que tu indiques dans la balise qui contient ton texte la classe css utilisé...ex : je fais un tableau...soit le code source suivant :<table> <tr> <td>ce texte est destiné à être mis en forme</td> </tr></table>ici, c'est la balise de la cellule td qui contient le texte...il suffira donc de dire :<td class="bleugras">ce texte est destiné à être mis en forme</td>pour que le texte soit mis en forme selon le style...à condition bien sûr d'avoir indiqué dans ta page le chemin de ta feuille de style :<head><title>mon blog sur les rollmops</title><link rel="stylesheet" type="text/css" href="stylesheet.css"></head>elle se place donc dans la balise head, et dans cet exemple elle est dans le même dossier que les pages html... Quote Selected
Re : Re : les CSS à la portée de tout le monde ! Reply #8 – Wednesday 01 March 2006, 14:16:50 Quote from: FinalBahamut – on Wednesday 01 March 2006, 12:15:00De cette manière, si par exemple tu veux un jour changer la couleur de texte de toutes les pages de ton site, tu n'auras qu'à trifouiller le code de ton fichier css et hop ! Toutes les pages de ton site auront leur couleur de texte changée.En complément, j'ajouterais que css2 permet en plus de contrôler l'emplacement et le formatage des différentes zones de la page, de sorte à avoir des sites vraiment "différents" au niveau mise en page. Pour cela, il faut passer par la balise div plutôt que la table, c'est plus compliqué à mettre en oeuvre, mais le résultat en vaut franchement la peine (si on souhaite mettre en place un système de skin que l'utilisateur choisit).Avec un lien pour illustrer cela : http://www.csszengarden.com/ Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #9 – Wednesday 01 March 2006, 15:48:08 vi ! enfin ça c'est le level au dessus !!! la crème de la crème in css Quote Selected
Re : les CSS à la portée de tout le monde ! Reply #10 – Wednesday 01 March 2006, 17:43:29 Yep, et faudrait que je my mette... Depuis le temps que je dis ça... ; Quote Selected
Re: les CSS à la portée de tout le monde ! Reply #11 – Wednesday 13 September 2006, 15:04:47 Bon... retour de ma part.Non, je n'ai pas abandonné mon idée! *têtue la fille* et maintenant que je vais pouvoir me poser, je me replonge dedans.Je suis retournée voir les liens donnés par Glazou' et m'en vais imprimer tout ça.Entre temps, j'ai retrouvé le tutoriel de NVu (le complet, pour la version standard), soit une belle centaine de pages à me potasser. A vrai dire, j'avais commencé une vague ébauche de site, mais m'étais arrêtée devant justement la lourde répétition "manuelle" des mises en forme des pages que de toute manière je perdais souvent en partie, même en récupérant le code source de la page qui me servait (toujours artisanalement) de modèle.Donc, je vais reprendre ma route difficile vers le design de site, ce qui signifie en gros qu'il va falloir vous attendre à voir fleurir une palanquée de questions débiles de ci de là dans ce topic... *rires dans le fond*Et on ne se moque pas, non mais!^^;;;;; Quote Selected
Re: les CSS à la portée de tout le monde ! Reply #12 – Thursday 14 September 2006, 11:13:06 bah amuse toi bien mais bon le mieux c'est de faire une page de base avec un menu, des liens, des images, des tableaux, bref toutes les joyeusetés du html , pis tu appliques les styles et tu modifies les styles directement...au moins c'est visuel, tu t'emmerdes pas Quote Selected
Re: les CSS à la portée de tout le monde ! Reply #13 – Thursday 30 August 2007, 09:22:37 Remontée de topic pour une question qui me pose souci.Mine de rien, je m'y suis mise, effectivement, les CSS c'est puissant, et extrêmement utile. Seulement, j'ai un peu de mal à intégrer la notion de chemin relatif/chemin absolu...En remontant ce topic, j'ai trouvé ces lignes données par Glaz':Quote<head><title>mon blog sur les rollmops</title><link rel="stylesheet" type="text/css" href="stylesheet.css"></head>elle se place donc dans la balise head, et dans cet exemple elle est dans le même dossier que les pages html...Donc, si je colle ces lignes dans mon code (en changeant le nom du fichier .css, bien évidemment), et sous condition que mes pages html soient dans le même dossier que mon .css, normalement, je passe en relatif, c'est ça?Et dans ce cas, justement, ou les pages html et css sont dans le même dossier, mon lien relatif, en fait, ce n'est que mon "nom de fichier".css et aucune arborescence avant?Nan, parce que forcément, sur ma bécane, ça marche, mais en ligne, ça marche pas. Je sais que j'ai merdouillé dans le chemin de la feuille de style, mais je voudrais être sûre que j'ai bien compris en fait^^ Quote Selected
Re: les CSS à la portée de tout le monde ! Reply #14 – Thursday 30 August 2007, 09:51:13 Euh... tu parles de quoi là ?De chemin relatif et absolu dans le html ou dans le css ( pour le positionnement ) ?Bon sinon moi je colle toujours tout en relatif ( sauf en cas de php / include chiant où je colle des url en absolu ) et c'est ce qu'il y'a faire... demande à tout intégrateur web il te diras la même chose que moi J'ai aussi la fâcheuse tendance à mettre mes images dans un dossier medias et ma css dans un dossier style... ce qui me donne un chemin<link href="styles/general.css" rel="stylesheet" type="text/css" media="all" />A priori je dirais que ton code est bon... file moi le lien de ta page ( pm si tu veux ) et je te dirais quoi...Je conseil aussi firebug qui permet de voir tous ce qui bug de css et de le modifier en ligne Quote Selected
Topic: les CSS à la portée de tout le monde ! (Read 3142 times)
previous topic - next topic
