Heim > Artikel > Web-Frontend > Wie formatiere ich ein Kontrollkästchen als Schaltfläche mit Hover-Effekt?
Ein Kontrollkästchen mit Hover-Effekt so gestalten, dass es einer Schaltfläche ähnelt
Beim Anpassen eines Kontrollkästchens so, dass es wie eine Schaltfläche aussieht und seine Interaktivität mit einem Hover verbessert wird Wirkung kann wünschenswert sein. Erreichen Sie dies mit den folgenden Schritten:
Ändern Sie Ihr CSS so, dass es Folgendes enthält:
<code class="css">#ck-button:hover { background: red; }</code>
Erklärung:
Diese CSS-Regel zielt auf # ck-button-Element beim Schweben und ändert seine Hintergrundfarbe in Rot.
Aktualisierte Fiddle: http://jsfiddle.net/zAFND/4/
Mit diesem Zusatz , Ihr Kontrollkästchen wechselt jetzt zu einem roten Hintergrund, wenn Sie mit der Maus darüber fahren, was eine intuitivere Benutzererfahrung bietet.
Das obige ist der detaillierte Inhalt vonWie formatiere ich ein Kontrollkästchen als Schaltfläche mit Hover-Effekt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!