Bootstrap圆形按钮

Question

我正在尝试使用Bootstrap创建圆形按钮，但它不能正常工作。这就是我在做的事情：

<button type="button" class="btn btn-default btn-circle">4</button>

它显示的结果如下：

我引用了this网站。我的bootstrap版本是3.3.5。有什么帮助吗？

Answer 1

就这样做..

<强> CSS

.btn-circle {
 border-radius: 50%;
}

Answer 2

您可以查看以下链接。

Fiddle

    .round-button {
    width:25%;
}
.round-button-circle {
    width: 100%;
    height:0;
    padding-bottom: 100%;
    border-radius: 50%;
    border:10px solid #cfdcec;
    overflow:hidden;

    background: #4679BD; 
    box-shadow: 0 0 3px gray;
}
.round-button-circle:hover {
    background:#30588e;
}
.round-button a {
    display:block;
    float:left;
    width:100%;
    padding-top:50%;
    padding-bottom:50%;
    line-height:1em;
    margin-top:-0.5em;

    text-align:center;
    color:#e2eaf3;
    font-family:Verdana;
    font-size:1.2em;
    font-weight:bold;
    text-decoration:none;
}

Answer 3

尝试：>>> a = ["A", "B", "C", "D", "E"] >>> >>> b = 0 >>> import itertools >>> acycle = itertools.cycle(a) >>> for i in range(11): ... print(a,next(acycle),i) ... ['A', 'B', 'C', 'D', 'E'] A 0 ['A', 'B', 'C', 'D', 'E'] B 1 ['A', 'B', 'C', 'D', 'E'] C 2 ['A', 'B', 'C', 'D', 'E'] D 3 ['A', 'B', 'C', 'D', 'E'] E 4 ['A', 'B', 'C', 'D', 'E'] A 5 ['A', 'B', 'C', 'D', 'E'] B 6 ['A', 'B', 'C', 'D', 'E'] C 7 ['A', 'B', 'C', 'D', 'E'] D 8 ['A', 'B', 'C', 'D', 'E'] E 9 ['A', 'B', 'C', 'D', 'E'] A 10

Answer 4

您可以使用此代码：

<button type="button" class="btn btn-default rounded-circle">4</button>