CSS3 button selector: Design Web link Smooth button

Article Introduction: CSS3 button Selector, through the CSS3 new features of the ordinary HTML link design into a visually smooth button m including gradient background, rounded corners, drop shadow, as well as conversion effects. Support CSS 3 animation, you can gradually change from the default state to hover state.

CSS3 button Selector, through the CSS3 new features to the ordinary HTML link design into a visually smooth button, including gradient background, rounded corners, drop shadow, as well as conversion effects. Support CSS 3 animation, you can gradually change from the default state to hover state, you can not use the picture as shown above the case of a beautiful button. button { -moz-border-radius:25px; -moz-box-shadow: #6E7849 0px 0px 10px; -moz-transition:all 0.5s Ease; -ms-transition:all 0.5s Ease; -o-transition:all 0.5s Ease; -webkit-border-radius:25px; -webkit-box-shadow: #6E7849 0 0 10px; -webkit-transition:all 0.5s Ease; Background-color: #6E7849; Background-image:-moz-linear-gradient (90deg, #B9C788, #6E7849); Background-image:-ms-linear-gradient (90deg, #B9C788, #6E7849); Background-image:-o-linear-gradient (90deg, #B9C788, #6E7849); Background-image:-webkit-linear-gradient (90deg, #B9C788, #6E7849); Background-image:linear-gradient (90deg, #B9C788, #6E7849); border-radius:25px; border:2px solid #4a5032; Box-shadow: #6E7849 0px 0px 10px; Color: #ffffff; Display:inline-block; Font-size:4em; Margin:auto; padding:15px; Text-decoration:none; Text-shadow: #000000 5px 5px 15px; Transition:all 0.5s Ease; } . button:hover { padding:15px; }