Ynov – HTML/CSS 2023 – Le test
Étape 1 sur 4
<!DOCTYPE html> <html> <head> <title>Titre de la page</title> </head> <body> <nav>Menu de navigation</nav> <article>Contenu principal</article> <footer>Pied de page</footer> </body> </html>
<!DOCTYPE html> <html> <head> <title>Titre de la page</title> <nav>Menu de navigation</nav> </head> <body> <article>Contenu principal</article> <footer>Pied de page</footer> </body> </html>
<!DOCTYPE html> <html> <head> <title>Titre de la page</title> <nav>Menu de navigation</nav> <article>Contenu principal</article> <footer>Pied de page</footer> </head> </html>
<nav>
<head>
<body>
<img src="image.png" alt="Image" />
<img src="image.png" alt="Image">Descriptif de l'image</img>
<img href="image.png" alt="Image" />
<ul> <li>Élément 1</li> <li>Élément 2</li> </ul>
<li> <ul>Élément 1</ul> <ul>Élément 2</ul> </li>
<div> <li>Élément 1</li> <li>Élément 2</li> </div>
<title>Titre de la page</title>
<TITLE>Titre de la page</TITLE>
<meta title="Titre de la page" />
<link>
<a>
<href>
<link href="page.html" target="_self">Lien vers une page</link>
<a href="page.html" target="_self">Lien vers une page</a>
<a src="page.html" target="_self">Lien vers une page</a>
.container > p { color: #333; }
.container p { font-weight: bold; }
.container + div { background-color: #f9f9f9; }
img { width: 100%; height: 100%; }
.img { width: 100%; height: 100%; }
#img { width: 100%; height: 100%; }
Si j’ai :
<img src="image.jpg" alt="Une image" class="uneimage" id="monimage">
#uneimage { width: 100%; height: 100%; }
.uneimage { width: 100%; height: 100%; }
#monimage { width: 100%; height: 100%; }
<div class="container"> <div class="row"> <div class="col">Colonne 1</div> <div class="col">Colonne 2</div> </div> </div>
.container { display: flex; justify-content: center; }
.row { display: flex; justify-content: center; }
.col { text-align: center; }
<ul> <li>L'élément 1</li> <li>L'élément 2</li> <li>L'élément 3</li> </ul>
ul { margin: 0 10px 0 10px; }
li { margin: 10px; }
ul li { margin: 10px; }
<img src="image.jpg" alt="Une image">
img.hover { border: 1px solid black; }
img:hover { border: 1px solid black; }
img { hover-border: 1px solid black; }
<head> <title>Ma Page</title> </head> <body> <h1>Ma Page</h1> <h2>Titre 1.1</h2> <p>Contenu</p> </body>
h1 { color: red; }
title { color: red; }
head title { color: red; }