Comment créer un en-tête fixe en HTML et CSS ?

Réponses rédigées par Antoine

Dernière mise à jour : 2022-03-05 12:39:14

Question

J'aimerais savoir comment créer un en-tête fixe ?

Réponse

Pour créer un en-tête fixe en HTML, vous pouvez utiliser la propriété CSS position avec la valeur fixed.

Dans l'exemple ci-dessous, on crée une CLASS CSS nommée fixe que l'on affilie à une balise <div> qui sera fixée en haut de l'écran.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Comment créer un en-tête fixe en CSS et HTML ?</title>
<style>
.fixe {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 75px;
  background-color: black;
}
.contenu {
  height: 5000px;
}
</style>
</head>
<body>
<div class="fixe"></div>
<div class="contenu"></div>
</body>
</html>

Vous trouverez d'avantage d'information sur la manière de fixer un en-tête HTML avec la propriété CSS position via cette page du site de Mozilla.