Maison > interface Web > tutoriel CSS > Comment créer un Div à défilement vertical avec CSS ?

Comment créer un Div à défilement vertical avec CSS ?

Susan Sarandon
Libérer: 2024-12-16 02:49:08
original
796 Les gens l'ont consulté

How to Create a Vertically Scrollable Div with CSS?

Div à défilement vertical avec CSS

Question :

Comment puis-je créer un div qui ne peut défiler que verticalement en utilisant CSS?

Réponse :

Pour faire défiler verticalement un div, il est important de spécifier la propriété overflow avec la valeur correcte.

La syntaxe pour le débordement est le suivant :

overflow: <value>;
Copier après la connexion

peut être :

  • visible : aucune barre de défilement n'est affichée, même si le contenu déborde du div.
  • caché : les barres de défilement ne sont affichées que lorsque le contenu dépasse le div.
  • scroll : Les barres de défilement sont toujours affichées, même si le contenu ne déborde pas du div.
  • auto : Les barres de défilement s'affichent uniquement lorsque le contenu déborde du div dans la direction spécifiée.
  • hériter : hérite de la propriété de débordement de l'élément parent.

Pour le défilement vertical uniquement :

  • Utilisez overflow-y : scroll ; pour forcer l'apparition d'une barre de défilement verticale, que le contenu dépasse ou non la hauteur du div.
  • Utilisez overflow-y: auto; pour afficher une barre de défilement verticale uniquement si le contenu dépasse la hauteur du div.

Par exemple, pour créer un div de 400 px de haut et pouvant défiler uniquement verticalement :

<div>
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal