Discover Top Posts Tagged with #css button

Multiple Transitions on a Button

Nice smooth multiple transitions on a button. 🆒 → Codepen: https://codepen.io/chriscoyier/pen/zrGvaq → 178 CSS Buttons: https://freefrontend.com/css-buttons/#button-hover-effects

#html #html5 #css #css3 #web design #web development #web inspiration #frontend #html button #html5 button #css button #css3 button

Botão Redondo Css

(request) Espero que estes sirvam. Desculpa a demora!

Css:

/* Botão po PASSO-HTML/GABRIELA */#btn { color: #FFFFFF; background: red; /* For browsers that do not support gradients */ background: -webkit-linear-gradient(left top, #FFDAB9, #EECBAD); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(bottom right, #FFDAB9, #EECBAD); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(bottom right, #FFDAB9, #EECBAD); /* For Firefox 3.6 to 15 */ background: linear-gradient(to bottom right, #FFDAB9, #EECBAD); /* Standard syntax */ border: 1px solid #EECBAD ; border-radius: 5px; box-shadow: 0px 5px 0px #8B7765; position: relative; width:30px; height:30px; border-radius:100%; text-decoration:none; display:inline-block; text-align:center; font-family:calibri; font-size:9px; text-transform:uppercase; line-height:30px; top: 0px; transition: all ease 0.3s; margin:5px; } #btn:active { box-shadow: 0 3px 0 #00823F; top: 3px; } #btn span{ padding-top:7px; font-size:15px; display:block; }

Html:

<a type="btn" id="btn" href="LINK">PALAVRA/ICON</a>

Se usar dê like.

Like if you use.

Gabriela