如何在 Bootstrap 3 Glyphicons 中传递数字答案

【问题标题】：How to Pass Numbers in Bootstrap 3 Glyphicons如何在 Bootstrap 3 Glyphicons 中传递数字
【发布时间】：2014-10-28 07:43:48
【问题描述】：

是否有任何选项或解决方案可以传递数字是 Bootstrap 3 Glyphicons 之类的

谢谢

【问题讨论】：

How to use CSS to surround a number with a circle?的可能重复

标签： css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

是否有任何选项或解决方案可以传递 Numbers 是 Bootstrap 3 Glyphicons？

简而言之，没有。这里是all the available glyphicons。

Glyphicons 以图像文件或字体集的形式出现。无论哪种方式，它们都不可扩展。它们是单独的图标。这就像说，我知道有一个 a-z 的字符集，但它是否也有一个小狗的图标。或者我知道这是一个苹果的图像，但像素可以改变，所以它是一个数字。

当然，您可以使用 CSS 轻松做到这一点。这是一个微不足道的实现，所以我不会担心“额外课程的成本”。如果你正在开发一个网站，你应该有很多课程。

试试how to use CSS to surround a number with a circle?的任何建议：

使用边框半径

<div class="numberCircle">30</div>

.numberCircle {
    border-radius: 50%;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */
    width: 36px;
    height: 36px;
    padding: 8px;
    background: #fff;
    border: 2px solid black;
    color: black;
    text-align: center;
    font: 32px Arial, sans-serif;
    display: inline-block;
}

使用 Unicode 字符

20 岁及以下，您可以使用enclosed_alphanumerics unicode characters：

&#9312;
&#9313;
&#9314;
&#9315;
&#9316;
&#9317;

① ② ③ ④ ⑤ ⑥

Demo in jsFiddle

【讨论】：

您好 KyleNit，感谢您的回复。我想知道这是否可以在 Bootstrap 本身中实现，所以不需要额外的类
简答，不。 Bootstrap 是一个开始的框架，但不会包含所有内容。当你有特定的东西时，开始添加这样的东西。如果您只使用 Bootstrap 中内置的内容，您将非常幸运，或者最终获得一个外观非常通用的网站。