带有CSS的Facebook风格按钮

Question

我有一个网站，我希望通过Facebook风格的按钮增强，但我不想使用标签这样做。如果我可以使用CSS来设置按钮的样式，那么我就可以了，这样我就有了Facebook风格的按钮。如果需要，愿意使用Javascript。任何人都可以帮助我吗？

Answer 1

边框，小填充和box-shadow: inset属性非常简单。有一个JSFiddle demonstrating this here。这不像Facebook那样使用额外的div，但我不会触及Facebook的来源。尝试使用~7个嵌套元素作为单个墙贴。

这是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;
}

我添加了一个文字阴影，给人以雕刻文字的印象，但你可以删除它。如果您想在IE中获取框和文本阴影，请使用this project使其正常工作。