Maison > interface Web > tutoriel CSS > Comment supprimer la bordure bleue des boutons dans Chrome sans compromettre l'accessibilité ?

Comment supprimer la bordure bleue des boutons dans Chrome sans compromettre l'accessibilité ?

Linda Hamilton
Libérer: 2024-12-21 15:05:10
original
871 Les gens l'ont consulté

How to Remove the Blue Border from Buttons in Chrome Without Compromising Accessibility?

Suppression de la bordure bleue des boutons personnalisés dans Chrome

Dans les efforts de personnalisation, définissez la bordure sur aucune pour les balises peuvent entraîner l’apparition d’une bordure bleue autour du bouton lorsque vous cliquez dessus dans Chrome. Bien que Button:active { outline: none } et Button:focus { outline:none } puissent sembler des solutions viables, ils ne parviennent pas à éliminer le problème.

Approche recommandée :

Il est fortement déconseillé de supprimer le focus ou le style du contour, car cela compromet l'accessibilité du site Web. Pour plus d'informations, reportez-vous à cette discussion.

Approche alternative (non recommandée) :

Si cela est jugé nécessaire, ce code CSS peut supprimer efficacement la bordure bleue :

button:focus { outline:0; }
Copier après la connexion

Un exemple fonctionnel peut être trouvé dans ce JSFiddle : http://jsfiddle.net/u4pXu/

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