Jednoduchý návod na CSS3 button.
Toto tlačidlo má:
- gradient
- text-shadow
- border-radius
- box-shadow
Tlačidlo v starších browseroch vyzerá menej sexy, má plnú farbu a nemá zaoblené hrany.
Ako na to:
.button {
padding: 7px 15px; background: #98BA40; background: -webkit-gradient(linear, left top, left bottom, from(#98BA40), to(#6C9D2C)); background: -moz-linear-gradient(top, #98BA40, #6C9D2C); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#98BA40', endColorstr='#6C9D2C'); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#98BA40', endColorstr='#6C9D2C'); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; text-shadow: 1px 1px 1px #73858A; filter: dropshadow(color=#73858A, offx=1, offy=1); border: 1px solid #608925; color: white; -webkit-box-shadow: inset 1px 1px 0px #C4D892; -moz-box-shadow: inset 1px 1px 0px #C4D892; box-shadow: inset 1px 1px 0px #C4D892; }
Pozrite aj:
Komentáre
Poslať nový komentár