Bonsoir, je commence à apprendre le HTML et le CSS sur le site du Zéro, mais je rencontre un problème que je n'arrive pas a résoude.
Je n'arrive pas à lier mes pages HTML avec mes pages CSS lorsqu'il s agit de modifier la police, la mise en page... de ma page HTML.
Si vous aviez une solution/explication a me donner ça m'arrangerai^^.
A travaillé sur : Actuellement sur : StarWars : Sombre révélation
M@teo21 a écrit:
Il faudra ajouter une ligne dans votre fichier .html entre les balises <head> </head> comme ceci :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Exemple d'utilisation de CSS externe</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
</head>
<body>
<p>Cette page comporte une feuille de style externe. C'est la meilleure méthode à utiliser quand on fait du CSS.</p>
</body>
</html>
La balise <link /> comporte plusieurs attributs. Vous pouvez en modifier deux d'entre eux pour le moment :
title : c'est le nom que vous donnez à votre feuille de style (mettez ce que vous voulez)
href : c'est l'emplacement où se trouve votre feuille de style sous forme de lien relatif. Dans cet exemple le CSS se trouve dans le même dossier, mais je vous recommande de le mettre dans un sous-dossier "styles/" par exemple.
si tu observes bien le code de M@teo21 (l'auteur du tutoriel) c'est cette ligne qui est importante :
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
elle DOIT se placer entre les balise <head> et </head>
c'est dans cette ligne que tu doit avoir fais une erreur !
attention, si tu ne fais qu'un copier coller de la ligne (ce qui ne te fera pas apprendre, mais bon...) il faudra soit changer le nom de ta feuille de style (ton fichier .css) et le renommer Design
soit changer le nom de fichier que ta page html va alle chercher :
href="design.css" indique à la page html de prendre sa feuille de style dans le fichier (ici ce fichier ce trouve dans le même dossier, ou dans le même répertoir que ta page html) dans le fichier qui se nomme "design.css" si ta feuille à un autre nom : fait comme cela : "(nom de ta feuille).css"
Attention : l'extention : ".css" est nécessaire, si tu ne la met pas, cela ne fonctionnera pas.
vérifie également que ton fichier est bien une feuille de style, si c'est un simple fichier texte (".txt"), peut-être que cela ne fonctionnera pas non-plus.
enfin, si l'erreur ne vient pas de là, vérifie bien ta ligne qui sert à inclure ta feuille de style (= ton fichier css)
c'est à dire : (la même que j'ai cité ci-dessu) :<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
voilà,
en espérant t'avoir aidé
au revoir ! et bon courage pour la suite !
Donc merci pour l'aide, c'est exactement ça.
Une autre question: comment lie t-on les pages lorsque comme sur l exemple du site on utilise par exemple .important en CSS?
H/F: Inscrit le: 24 Juin 2007 Messages: 413 Localisation: Ubuntu town, 7.10 route des Glaçons.
A travaillé sur : SynopsLive (créateur et animateur)
Amroth a écrit:
Une autre question: comment lie t-on les pages lorsque comme sur l exemple du site on utilise par exemple .important en CSS ?
Un groupe avec le sélecteur .truc s'appliquera à toutes les balises ayant une classe truc (par exemple, <span class="truc"></span>).
Pour information, un groupe avec le sélecteur #machin s'appliquera à l'unique balise (car il ne doit y en avoir qu'une seule) ayant l'id machin (par exemple, <div id="machin"></div>). _________________
H/F: Inscrit le: 10 Fév 2008 Age: 15 Messages: 89 Localisation: Qu'est ce que j'en sais ?
A travaillé sur :
Pour la police, il suffit que tu écrives dans le fichier CSS pour par exemple avoir le paragraphe en Black Chancery :
p
{
font-family : "Black Chancery", serif ;
}
Il faut toujours finir par serif lorsque tu fais une liste de police, ça choisit automatiquement une police installée sur l'ordi du visiteur.
Et puis, mettre entre guillemets la police s'il y a des espaces ^^ _________________
Pour la police, il suffit que tu écrives dans le fichier CSS pour par exemple avoir le paragraphe en Black Chancery :
p
{
font-family : "Black Chancery", serif ;
}
Il faut toujours finir par serif lorsque tu fais une liste de police, ça choisit automatiquement une police installée sur l'ordi du visiteur.
Et puis, mettre entre guillemets la police s'il y a des espaces ^^
Euh c'est maladroit de mettre une police qui n'est pas installée par défaut sur
les PC des surfeurs. Et pas forcément besoin de mettre entre guillemets
quand il y a des espaces (je le fais pas et mon code a été certifié conforme
W3C ) _________________
je sais qu'au démarrage, j'ai eu le même problème, alors que j'avais bien mis la balise <link> </link>. Et en faite, le problème ne venais pas de mon XHTML mais de mon CSS.
J'avais fait une erreur sur mon CSS (oublie d'un point virgule, d'un point ou d'un tiret) et mon CSS ne voulait pas marcher. Vérifie, on sait jamais surtout si tu es comme moi, un grand débutant _________________ Patate lancer, pigeon dégommé.
A travaillé sur : Actuellement sur : StarWars : Sombre révélation
Sinon, si tu voit mal comment 2 fichier séparer peuvent intéragire entre eux, tu peux utiliser l'autre méthode proposé sur le site du zéro (qu'il appele : méthode "à l'arrache" qui fonctionne : là tu as tout sur ta même feuille, si c'est bien ça qui te gêne )
il suffit juste de mettre ton code CSS entre ces balise :
ATTENTION, ton code css, et donc, ce que je vien de citer (+ ton code à l'intérieur de ces balise) DOIT ETRE ENTRE LES BALISE <head> et </head>
vérifie aussi que tu as bien écrit les balise head, link ... et que les caractéristique de ces balise son correcte. et puis, comme t'as dis ludo, vérifis aussi ton code css.
sinon, montre nous ton code...
mais, c'est en s'entrainant que tu pourras après faire tes codes tout-seul, (personnelement, j'apprend le php, et je viens de passer plus d'une heures à chercher quelques erreurs, je ne me referais plus (ou très peu) avoir comme ça ) _________________ STAR WARS Sombres révélations
Bande annonce :
pour télécharger les 4 premiers épisodes : http://warcraft.campagne.free.fr/saga/saga.php
on en parle ici => http://forum.netophonix.com/ftopic2865.html
Toutes les heures sont au format GMT + 1 Heure Aller à la page 1, 2Suivante
Page 1 sur 2
Vous ne pouvez pas poster de nouveaux sujets dans ce forum Vous ne pouvez pas répondre aux sujets dans ce forum Vous ne pouvez pas éditer vos messages dans ce forum Vous ne pouvez pas supprimer vos messages dans ce forum Vous ne pouvez pas voter dans les sondages de ce forum
FAQ
Rechercher
Liste des Membres
Groupes d'utilisateurs
S'enregistrer
Profil
Se connecter pour vérifier ses messages privés
Connexion
Règles et fonctionnement
