css - 如果我使用的是来自 MaxCDN 的 bootstrap.min.css 文件而不是下载的 Bootstrap 文件，我该如何加载我的字体集中的新自定义图标？

Question

我之前使用的是下载的 bootstrap.min.css 文件版本，我已经添加了

.glyphicon-location2:before{content:"\e948"}

内联到该文件(这是网站模板中包含的自定义编辑)。我已经使用 icomoon 更新了我的 glyphicon 字体集，并在我的元素文件中引用了下载的字体集。现在，我想使用 CDN 版本的 bootstrap.min.css 来加速我的页面加载，但这似乎只引用了默认的字形，因为网页输出中缺少我的自定义字形.

1. 预加载的 CDN 版本“应该”提高多少速度？
2. 从我的自定义本地文件字形集中提取图标的字形引用应放在哪里？我是否必须覆盖默认字体源并指向本地字体集，类似于此线程中的答案(请记住我没有使用 SCSS 或节点)？

   how does $icon-font-path works in bootstrap scss?

我可以通过添加

来覆盖默认字形吗？

@font-face {
font-family:'Glyphicons Halflings';
src:url('fonts/glyphicons-halflings-regular.eot');
src:url('fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
url('fonts/glyphicons-halflings-regular.woff') 格式('woff'),
url('fonts/glyphicons-halflings-regular.ttf') format('truetype'),
url('fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') 格式('svg')


到我的 style.css 文件，还是我必须在别处覆盖 bootstrap.min.css 字体处理？

Answer 1

这是我能够使字形图标出现的 CSS 代码片段。尝试使用如下所示的字体系列。仅供引用，这增强了 Bootstrap 的 Accordion

.panel-heading .accordion-toggle:after {
/* symbol for "opening" panels */
font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
content: "\e114";    /* adjust as needed, taken from bootstrap.css */
float: right;        /* adjust as needed */
color: #328ED1;         /* adjust as needed */
 }

.panel-heading .accordion-toggle.collapsed:after {
/* symbol for "collapsed" panels */
content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}