Comment toujours afficher la barre de défilement verticale dans les navigateurs WebKit ?

Toujours afficher la barre de défilement verticale

Dans certaines conceptions Web, il est crucial de garantir que les utilisateurs peuvent facilement identifier le contenu défilant dans un élément div. Malgré le paramètre overflow-y: scroll, la barre de défilement verticale peut ne pas être visible lorsqu'elle n'est pas activement utilisée sur certains systèmes d'exploitation, tels que macOS.

Solution :

Pour forcer l'affichage permanent de la barre de défilement verticale, utilisez les propriétés CSS suivantes :

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

Ces styles s'appliquent aux navigateurs basés sur WebKit, tels que Safari et Chrome sur macOS. En personnalisant l'apparence de la barre de défilement, vous pouvez la rendre plus visible et indiquer la présence de contenu défilant même lorsqu'il n'est pas utilisé activement.

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!