Ouvrir notepad ou un éditeur de code quelconque et copier coller le code ci-dessous :
body {
color: rgb(200,0,100); /* couleur du texte */
padding-left: 20px; /* marge intérieure à gauche */
background-color: #9fc9b9; /* couleur de fond */
}
h1 {
font-size: 24px; /* taille de police */
}
h2 {
font-size: 18px;
}
img {
width: 50%; /* largeur en % */
}Enregistrer votre page avec le nom « style.css » dans votre dossier pages_web
Ajouter dans le head de votre page index.html la ligne suivante :
<link rel="stylesheet" href="style.css">Vous devez alors avoir une page index.html ressemblant à ceci :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ma page web</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1> Un titre de niveau 1</h1>
<h2> un titre de niveau 2</h2>
<p> un paragraphe</p>
<img src="images/image1.png">
<a href="page1.html">page suivante</a>
</body>
</html>Enregistrer votre page et observer le résultat dans votre navigateur.
Félicitations, vous avez donné du style à votre page. A vous de le modifier.
Votre dossier doit ressembler à :
