Готини стилове за бутони

стилове
бутони

Колекция от свежи експериментални стилове за копчета. Използва CSS анимация и манипулиране на псевдоелементи.

Основни стилове за бутони:

Следните стилове се използват за оформяне на граници, размери и други свойства:

Всеки от примерите използва различни стилове за украса на бутоните.

Нека да разгледаме пример, наречен „Itzel“:

В този пример използваме маска, като я прилагаме към псевдоелемента на бутона. Този метод ще работи само в най-новите версии на браузърите. IE, както винаги, е изключение. Firefox ще използва SVG и clipPath.

За да постигнем ефекта, скриваме псевдоелемента, като го плъзгаме надолу. Когато се връщаме в първоначалното си състояние, ще приложим различна трансформация на границите на елемента. Иконата изчезва по същия начин. При преместване с мишката текстът изчезва, като зададете непрозрачността на 0.