# 038: Добавяне на състояния на бутоните - CSS-трикове

Anonim

Създадохме външния вид на бутон в нормално състояние, но 3D бутон като този моли за състояние „избутано“. Това, което правим, е да добавим по-тъмен цвят към бутона на :hoverи :focus. След това за :active(избутано) премахваме част от box-shadows и го бутаме надолу и надясно с относително позициониране. Толкова е просто, бутонът вече има наистина очевидно и задоволително изживяване, когато щракнете върху него.

Това, което изниква в съзнанието ви: когато регулирате относителното позициониране със стойности отгоре / отляво / отдолу / отдясно по този начин, трябва да бъдете внимателни в бъдеще, ако трябва да позиционирате абсолютно елемента. Може да се получат луди скокове, тъй като отгоре / отляво / отдолу / отдясно означава нещо много по-различно при абсолютно позициониране, отколкото при относително позициониране.