# 038: Legge til knappestater - CSS-triks

Anonim

Vi har laget utseendet til en knapp i normal tilstand, men en 3D-knapp som ber om en "presset" tilstand. Det vi gjør er å legge til en mørkere farge på knappen på :hoverog :focus. Så for :active(presset) fjerner vi noen av box-shadowsene og skyver det ned og til høyre med relativ posisjonering. Det er så enkelt som det, knappen har nå en veldig åpenbar og tilfredsstillende opplevelse når du klikker på den.

En som det kommer i tankene: når du justerer relativ posisjonering med verdier for topp / venstre / bunn / høyre slik, må du være forsiktig i fremtiden hvis du trenger å plassere elementet absolutt. Du kan få sprø hopp på gang, siden øverst / venstre / nederst / høyre betyr noe langt annerledes med absolutt posisjonering enn det gjør med relativ posisjonering.