web-dev-qa-db-fra.com

Supprimer la bordure des boutons

J'ai essayé de créer des boutons et d'insérer mes propres images au lieu des images de boutons standard. Cependant, la bordure grise des boutons standard reste, montrant à l'extérieur de mes images de bouton noir.

Est-ce que quelqu'un sait comment supprimer cette bordure grise du bouton, c'est donc juste l'image elle-même? Je vous remercie.

htmlcssbutton
84
JamesonW

Ajouter

padding: 0;
border: none;
background: none;

à vos boutons.

Démo:

https://jsfiddle.net/Vestride/dkr9b/

146
Vestride

Cela semble fonctionner pour moi parfaitement.

button:focus { outline: none; }
28
Daniel Lee

J'avais le même problème et même si je dessinais mon bouton en CSS, il ne prendrait jamais le border:none, mais ce qui fonctionnait était d'ajouter un style directement sur le bouton de saisie, comme ceci:

<div style="text-align:center;">
    <input type="submit" class="SubmitButtonClass" style="border:none;" value="" />
</div>
7
Flea

Essayez d’utiliser: border:0; ou border:none;

2
Filipe Manuel

L'astuce habituelle est de faire en sorte que l'image elle-même fasse partie d'un lien plutôt que d'un bouton. Ensuite, vous liez l’événement "click" avec un gestionnaire personnalisé.

Des cadres tels que Jquery-UI ou Bootstrap le font immédiatement. En passant, utiliser l’un d’eux peut grandement faciliter la conception de toute l’application.

1
yadutaf

Vous pouvez également essayer background:none;border:0px sur les boutons.

les sélecteurs css sont également div#yes button{..} et div#no button{..}. espère que cela aide

1
user1527729

$ (". myButtonClass"). attr ("style", "bordure: aucune; couleur de fond: blanc; remplissage: 0"); fonctionne parfaitement pour mes pages .xhtml.

0
KenDev