Question

我已在我的网络应用中集成了引导程序。在Firefox中，所有字形都以任何字体大小进行像素化。在Chrome中，可以正常呈现。可能是什么问题呢？

Img：

以下是从:before元素中检查过的CSS收集的图标（注意其中一些可能会划掉，但复制/粘贴不能保留此内容）

button.table-btn.view::before {
    content: "\e086";
}
button.table-btn::before {
    font-family: 'Glyphicons Halflings',serif;
    font-size: 18px;
    padding: 6px;
}
*::after, *::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
button {
    cursor: pointer;
    font: inherit;
    letter-spacing: inherit;
}
a, a::after, button {
    color: inherit;
}
button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
    cursor: pointer;
}
button, select {
    text-transform: none;
}
button, input, optgroup, select, textarea {
    font: inherit;
    color: inherit;
}
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    line-height: 1.42857143;
}
table {
    border-spacing: 0;
    border-collapse: collapse;
}
body {
    color: #666;
    font: 12px/1 Verdana,Geneva,sans-serif;
}
body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
}
html {
    font-size: 10px;
}
html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
}

Answer 1

它与CSS无关。它可能是你的浏览器。

尝试在Firefox中禁用或启用硬件加速。

工具＆gt;选项＆gt;高级＆gt;一般＆gt;浏览：＆＃34;在可用时使用硬件加速＆＃34;

复制自：https://support.mozilla.org/en-US/questions/943289

Answer 2

尝试提供字体平滑

.font-smoothing {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

Firefox中的Glyphicons是像素化的

2 个答案: