Page 1 sur 1
Feuille de style
Publié : 21 août 2006, 13:53
par Rom
Bonjour à tous
Je sais que le sujet a été maintes fois rabâché, mais je n'ai pas trouvé mon bonheur, ou je n'ai rien compris aux sujets déjà existants !
Côté CSS, je maîtrise les bases... J'ai un forum aceboard avec lequel je manipule ces données, donc je pourrais m'en sortir avec mon site...
Or, je ne sais pas comment faire pour que ma feuille de style s'applique sur mes pages ! J'ai essayé de regarder avec les codes de certains sites qui utilisent le CSS, ai reprodui la même chose mais niette...
Vos conseils sont toujours les bienvenus ?
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6
Publié : 21 août 2006, 18:28
par Sebaz
tu créé ta feuille de style (par exemple: feuille_style.css)
et pour lier cette feuille à tes pages web ajoute la ligne suivante
<link rel="stylesheet" href="feuille_style.css" type="text/css">
entre le <head> et </head> de tes pages
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6
Publié : 21 août 2006, 19:47
par Rom
D'accord et comment je fais pour avoir l'extension .css
Lorsque j'enregistre sous je force l'extension ?
Et ma feuille de style, elle doit avoir des balises genre <head>, <body>...
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6
Publié : 21 août 2006, 20:32
par Sebaz
Pour créer la feuille de style, il est possible de le faire avec l'éditeur css (Outil >> Éditeur Css)
tu créé le style et ensuite clique sur: «exporter la feuille de style et utiliser la version exportée»
si la feuille de style créé n'a pas l'extention .css alors tu l'ajoute
Moi j'utilise une autre méthode pour créer ma feuille de style.
Je créé ma feuille de style avec
SciTE Source Code Editor et lui donne l'extention .css
voici un exemple de feuille:
Code : Tout sélectionner
body {
font-size: larger;
background-color: #cccccc;
}
h1 {
font-size: 50pt;
}
h2 {
color: maroon;
font-family: sans-serif;
font-size: 22pt;
}
#boite {
border-style: outset;
border-width: 2px;
margin: 40px 5%;
padding: 2px;
color: #000000;
background-color: #ffffcc;
}
On ajoute aucune balises genre <head>, <body>...
Voici un code de page simple qui utilise ces styles:
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Exemple</title>
<link rel="stylesheet" href="feuille_style.css" type="text/css">
</head>
<body>
<h1>Titre h1</h1>
<h2>Titre h2</h2>
<div id="boite"><br>Boite<br></div>
</body>
</html>
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6
Publié : 22 août 2006, 17:35
par Rom
Oki Oki merci beaucoup !
Je vais essayer d'utiliser tout ça ! Merci d'avoir rpis le temps de m'aider
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1
Publié : 22 août 2006, 17:49
par Rom
Ca a marché !
Super, merci encore !
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1
Publié : 23 août 2006, 09:47
par chinon37
l'extension
KaZcadeSpermet de créer les feuilles de styles sans connaitre l'ensemble des noms de propriétés des éléments. c'est une version débuggée de l'éditeur css de Nvu.
Les feuilles de style sont créées de façon assez intuitive.
Publié : 23 août 2006, 12:22
par Rom
Et comment l'installe t-on ? Je dois placetr le fichier où ?
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1
Publié : 23 août 2006, 14:45
par chinon37
Comme toute extension,
dans nvu, tu vas à "outils" -> extensions -> installer
dans la fenêtre qui s'ouvre, tu vas dans le dossier où tu as téléchargée l'extension et tu cliques 2 fois dessus. ( attention que le nom du fichier se termine bien par .xpi)
Tu cliques 2 fois sur le fichier kazcadesxxxxxx.xpi. au bout de 2 secondes environ, il t'est demandé de confirmer l'installation.
Une fois l'installation terminée, tu quittes Nvu et tu l'ouvres à nouveau: l'extension est opérationnelle. Tu peux mettre une icone (une palette de peintre) dans la barre d'outils pour ouvrir l'éditeur css plus rapidement.
Quand tu lanceras l'éditeur css par "outils" ou l'icone, ce sera désormais kazcades qui s'ouvrira.