# 038: Lägga till knapptillstånd - CSS-tricks

Anonim

Vi har skapat utseendet på en knapp i det vanliga tillståndet, men en 3D-knapp som den ber om ett "tryckt" tillstånd. Vad vi gör är att lägga till en mörkare färg på knappen på :hoveroch :focus. Sedan för :active(tryckt) tar vi bort några av box-shadows och skjuter ner det och till höger med relativ positionering. Det är så enkelt som det, knappen har nu en riktigt uppenbar och tillfredsställande upplevelse när du klickar på den.

En som kommer att tänka på: när du justerar relativ positionering med värdena uppe / vänster / nedre / höger så måste du vara försiktig i framtiden om du absolut behöver placera elementet. Du kan få några galna hopp på gång, eftersom uppe / vänster / nedre / höger betyder något mycket annorlunda med absolut positionering än med relativ positionering.