The good semantic way would be to use a checkbox, and then style it in different ways if it is checked or not. But there are no good ways do to it. You have to add extra span, extra div, and, for a really nice look, add some javascript.
So the best solution is to use a small jQuery function and two background images for styling the two different statuses of the button. Example with an up/down effect given by borders:
$(document).ready(function() {
$('a#button').click(function() {
$(this).toggleClass("down");
});
});a {
background: #ccc;
cursor: pointer;
border-top: solid 2px #eaeaea;
border-left: solid 2px #eaeaea;
border-bottom: solid 2px #777;
border-right: solid 2px #777;
padding: 5px 5px;
}
a.down {
background: #bbb;
border-top: solid 2px #777;
border-left: solid 2px #777;
border-bottom: solid 2px #eaeaea;
border-right: solid 2px #eaeaea;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="button" title="button">Press Me</a>Obviously, you can add background images that represent button up and button down, and make the background color transparent.