Appliquer la notion
On dispose du code HTML et CSS suivant.
1
2
<html>
3
<head>
4
<meta charset="utf-8">
5
<title>Exercice</title>
6
<link rel="stylesheet" type="text/css" href="style.css">
7
</head>
8
<body>
9
<h1>Palette</h1>
10
<table>
11
<tr>
12
<td class="red">Red</td>
13
<td class="blue">Blue</td>
14
<td class="green">Green</td>
15
<td class="yellow">Yellow</td>
16
</tr>
17
<tr>
18
<td class="black">Black</td>
19
<td class="pink">Pink</td>
20
<td class="orange">Orange</td>
21
<td class="violet">Violet</td>
22
</tr>
23
</table>
24
</body>
25
</html>
1
h1 {2
color: indigo;
3
}
4
table {5
margin: 55px;
6
border: black solid 1px;
7
}
8
td {9
padding: 10px;
10
}
11
.red {12
background: red;
13
}
14
.blue {15
background: cornflowerblue;
16
}
17
.pink {18
background: hotpink;
19
}
20
.yellow {21
background: gold;
22
}
23
.orange {24
background: orange;
25
}
26
.green {27
background: greenyellow;
28
}
29
.violet {30
background: purple;
31
}
32
.black {33
background: black;
34
color: white;
35
}
Question
Intégrer ces deux fichiers dans Repl.it et visualiser le résultat.
Question
Quel élément est entouré d'une bordure ?
Solution
L'élément <table>.
Question
Quelle propriété CSS modifie la couleur d'un texte ?
Solution
La propriété color.
Question
Changer le style de la case « Black » pour lui mettre un fond blanc et un texte noir.
Solution
1
.black {2
background: white;
3
color: black;
4
}
