webentwicklung-frage-antwort-db.com.de

Rahmen von Knöpfen entfernen

Ich habe versucht, Schaltflächen zu erstellen und anstelle der Standardschaltflächen eigene Bilder einzufügen. Der graue Rand der Standardschaltflächen bleibt jedoch bestehen und wird außerhalb meiner schwarzen Schaltflächen angezeigt.

Weiß jemand, wie man diesen grauen Rand von der Schaltfläche entfernt, so dass es nur das Bild selbst ist? Danke.

htmlcssbutton
84
JamesonW

Hinzufügen

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

zu Ihren Knöpfen.

Demo:

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

146
Vestride

Das scheint bei mir perfekt zu funktionieren.

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

Ich hatte das gleiche Problem und obwohl ich meine Schaltfläche in CSS gestylt habe, würde es niemals das border:none aber was funktionierte, war das Hinzufügen eines Stils direkt auf der Eingabeschaltfläche wie folgt:

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

Versuchen Sie es mit: border:0; oder border:none;

2
Filipe Manuel

Der übliche Trick besteht darin, das Bild selbst zu einem Teil eines Links zu machen und nicht zu einer Schaltfläche. Anschließend binden Sie das Ereignis "click" mit einem benutzerdefinierten Handler.

Frameworks wie Jquery-UI oder Bootstrap macht dies sofort. Die Verwendung eines dieser Frameworks kann übrigens die gesamte Anwendungskonzeption erheblich vereinfachen.

1
yadutaf

Sie können auch background:none;border:0px zu den Tasten.

auch die CSS-Selektoren sind div#yes button{..} und div#no button{..}. hofft, es hilft

1
user1527729

$ (". myButtonClass"). attr ("style", "border: none; Hintergrundfarbe: weiß; padding: 0"); funktioniert wunderbar für meine .xhtml Seiten.

0
KenDev