Comment puis-je forcer l'apparition des barres de défilement sur les navigateurs mobiles ?

Affichage des barres de défilement dans les navigateurs mobiles

Cette question se concentre sur le problème des barres de défilement masquées dans les navigateurs mobiles lors de l'utilisation de "overflow:auto" ou " overflow:visible" sur le contenu défilant. Bien que la barre de défilement soit visible sur les navigateurs de bureau, elle disparaît sur les appareils mobiles à moins d'un défilement actif.

Pour résoudre ce problème, vous pouvez modifier votre CSS pour inclure le code suivant, spécifique au moteur de navigateur Webkit :

::-webkit-scrollbar {
    -webkit-appearance: none;
}

::-webkit-scrollbar:vertical {
    width: 12px;
}

::-webkit-scrollbar:horizontal {
    height: 12px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 10px;
    border: 2px solid #ffffff;
}

::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #ffffff;
}

Ce code définit l'apparence de la barre de défilement, y compris sa largeur, sa hauteur, la couleur du pouce et la couleur de la piste. En personnalisant ces propriétés, vous pouvez rendre la barre de défilement toujours visible sur les appareils mobiles, avant même de faire défiler.

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!