Simple CSS3 Buttons

Posted on by David Turner

CSS3 allows for a lot of design elements, which we would have previously have depended upon images for, to be created using CSS. This provides an easier way to create and style content. This is an example of some of the basic things which can be achieved using CSS3.

Each example shows 3 states, the default styling, how things look when you hover over them and the state when you click on them. Examples have been put together to show different colours being used as well as using some additional CSS properties to adjust the look of some buttons.

<a> Tag

Testing

Testing

Testing

<input /> Tag





<button> Tag





<a> Tag

Testing

Testing

Testing

<input /> Tag





<button> Tag





<a> Tag

Testing

Testing

Testing

<input /> Tag





<button> Tag





<a> Tag

Testing

Testing

Testing

<input /> Tag





<button> Tag