Facebook Style Buttons with CSS [closed]

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetoric开发者_运维问答al and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. Closed 11 years ago.

I have a website I am looking to enhance with Facebook-style buttons, but I don't want to use the tag to do so. I would be okay with an if I could use CSS to style the buttons so that I had a result of Facebook-style buttons. Willing to use Javascript if the need arises. Can anyone help me?

---

This is really easy with a border, a little padding and a box-shadow: inset property. There's a JSFiddle demonstrating this here. This uses no extra divs like Facebook does, although I wouldn't touch the Facebook source. Try ~7 nested elements for a single wall post.

Here's the CSS:

a {
    -moz-user-select: none;
    background: #2A49A5;
    border: 1px solid #082783;
    box-shadow: 0 1px #4C6BC7 inset;
    color: white;
    padding: 3px 5px;
    text-decoration: none;
    text-shadow: 0 -1px 0 #082783;
    font: 12px Verdana, sans-serif;
}

I've added a text shadow to give the impression of engraved text, but you can remove it. If you want to get the box and text shadow in IE, use this project to make things work.