18041 sujets

Questions générales et questions de débutants

Probleme de couleur

bonjour,
je suis nouveau sur le forum et débutant en html5 et css3, donc je cumule, merci pour votre indulgence !

je suis de train d'écrire cette page html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="style.css" />
<title> Premiers tests du CSS</title>
</head>

<body>
<h1> Mon super site</h1>
<p class="introduction"> Bonjour et bienvenue sur mon site !</p>
<p> Pour le moment, c'est un peu <em>vide</em> !</br>
Patientez encore un peu, ça va venir</p>
</body>
</html>

j'ai relié cette page à un fichier css qui est dans le même répertoire que ma page html
/* Style.css
------------

*/style.css
------
Par eric Kalamouka
/*
.introduction
{
color: red;
}

et là patatrac, mon paragraphe "introduction" n'apparaît pas en rouge !
quelqu'un peut il me dire pourquoi ? ou alors ou trouvez la réponse ?
d'avance merci
Modérateur
Erickpro a écrit :
je suis nouveau sur le forum et débutant en html5 et css3, donc je cumule, merci pour votre indulgence !

Bonjour, pas de problèmes, il faut bien commencer un jour Smiley smile

je vois quelque part Style.css et style.css, suivant le système peut-être est-ce ça.
Sinon inspecter la console et les outils de développement (http://www.alsacreations.com/astuce/lire/1436-console-javascript.html) peut s'avérer très utile, pour voir les erreurs, les sources introuvables ou consulter les CSS appliquées.
merci pour ta contribution,
le Style.css est un commentaire, je l'ai remis en minuscule mais pas de changement
mon paragraphe introduction ne s'affiche pas en rouge comme le demande mon code mais il y a un probleme
Bonjour,

Ton fichier style.css contient-il tout ceci ou est-ce uniquement pour ce topic ?
/* Style.css
------------

*/style.css
------
Par eric Kalamouka
/*
.introduction
{
color: red;
}
Dans le cas où ceci représente ton fichier css, tu dois certainement avoir une grosse erreur de lecture.
Tu mets en commentaire "style.css etc" toutefois les signes sont inversés.
Un commentaire commence par '/*' et fini par '*/'.

D'autre part tu dois inclure dans ces commentaires toutes les lignes qui ne sont pas du Css à proprement parler.

Théoriquement, comme ceci tu devrais pouvoir continuer ton apprentissage :

/* (<= marque de début de commentaire)
Style.css
------------

style.css
------
Par eric Kalamouka
(marque de fin de commentaire =>)*/

/* ci-dessous début du code css */
.introduction
{
color: red;
}

N'est-ce pas mieux ainsi ?

Bonne continuation dans ton apprentissage.
Modifié par Greg_Lumiere (31 Aug 2016 - 14:33)
En passant...

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="style.css" />
<title> Premiers tests du CSS</title>
</head>

Tu dois spécifier la langue du document dans la balise <html>.

Conventionnellement, la balise title se place juste après <meta charset="utf-8"/>. J'ignore toutefois si cela a une importance.

L'espace avant le slash de fermeture des balises standalone en syntaxe XHTML n'était nécessaire que dans de très anciens navigateurs, qui, sans cet espace, ne reconnaissaient pas ces balises.

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8"/>
<title>Premiers tests du CSS</title>
<link rel="stylesheet" href="style.css"/>
</head>

Enfin, je pense qu'il serait souhaitable d'inclure tes contenus dans une balise comme <main></main> (à mettre en display: block pour IE et Edge) pour pouvoir limiter leur largeur sur grands écrans, cf http://www.alsacreations.com/article/lire/750-HTML5-nouveautes.html.

Bonne continuation.
Modifié par thierry (31 Aug 2016 - 11:20)
thierry a écrit :
Conventionnellement, la balise title se place juste après &lt;meta charset="utf-8"/&gt;. J'ignore toutefois si cela a une importance.

A priori, pas d'importance sur le rendu global au niveau du DOM.
Par contre, placer la balise TITLE après la déclaration du jeu de caractère tient simplement au fait que le titre contenant, par définition, du texte, la détection de l'encodage le plus en amont possible, donc avant ledit titre, facilite l'affichage correct par le navigateur.
L'ordre METAT (Charset) puis TITLE est donc effectivement très souvent préconisé pour cette raison.
Modifié par sepecat (31 Aug 2016 - 14:11)
bonjour, le problème est résolu, cela a priori venait de la façon d'inscrire les commentaires. merci à tous. eric
Sujet clos
Aller à