css - Bootstrap 中的自定义按钮

Question

我在 Twitter bootsrap 3 中创建自定义按钮时遇到问题。

我需要做这样的按钮(右下角有三 Angular 形)。 http://i.imgur.com/Xkvfh32.jpg

我知道解决该问题的一种方法是使用此按钮的背景并添加文本。但是是否有自定义按钮生成器来执行那样的按钮？

最好的问候

Answer 1

你不能让 Bootstrap 为你生成这个按钮，但你可以在你的 CSS 中自己定义它。

这是一个仅使用 CSS 的很酷的解决方案:

<a href="#">Button!</a>


a{
    background:#b6174d;
    color: white;
    font-weight: bold;
    padding: 10px 15px;
    text-decoration: none;
    font-family: Arial;
    position:relative
}

a:after{
    content: "";
    position: absolute;
    bottom: 0px;
    right: 0px;
    border-width: 0px 0px 13px 13px;
    border-style: solid;
    border-color: #fff transparent;
    display: block;
    width: 0;
}

a:hover{
   background: #e83370;
}

或者检查 fiddle :http://jsfiddle.net/9tPcZ/1/