En CSS, la propriété overflow est utilisée pour contrôler le comportement du contenu qui déborde de son élément conteneur. Il est souvent utilisé conjointement avec une hauteur ou une largeur spécifiée pour définir le comportement du contenu lorsqu'il dépasse les dimensions spécifiées. La propriété overflow peut prendre plusieurs valeurs :

1. visible (par défaut) : le contenu n'est pas tronqué et peut déborder de la zone de contenu.

    css
    .example {
     overflow: visible;
   }
   

2. caché : le contenu qui déborde est tronqué et non visible.

    css
    .example {
     overflow: hidden;
   }
   

3. scroll : ajoute une barre de défilement à l'élément, permettant à l'utilisateur de faire défiler et de voir le contenu caché.

    css
    .example {
     overflow: scroll;
   }
   

4. auto : similaire au défilement, mais une barre de défilement n'est ajoutée que si le contenu déborde.

    css
    .example {
     overflow: auto;
   }
   

5. hériter : la propriété overflow hérite de sa valeur de l'élément parent.

    css
    .example {
     overflow: inherit;
   }
   

Voici un exemple simple illustrant l'utilisation de la propriété overflow :

 css
 .container {
  width: 200px;
  height: 100px;
  overflow: scroll;
}

.content {
  width: 300px;
  height: 150px;
  background-color: lightblue;
}
 

 HTML
 <div class="container">
  <div class="content">
    <!-- Content that exceeds the container dimensions -->
    <!-- Scrollbars will appear due to the overflow: scroll; property -->
  </div>
</div>

Dans cet exemple, le contenu du div .content dépasse les dimensions spécifiées par le div .container et les barres de défilement apparaîtront en raison de la propriété overflow: scroll; sur le conteneur.

Ajustez les valeurs et les propriétés en fonction de vos exigences spécifiques en matière de mise en page et de conception.