html - Firefox 中的字形图标是像素化的

标签 html css twitter-bootstrap

我在我的网络应用程序中集成了 Bootstrap 。在 Firefox 中,所有字形图标在任何字体大小下都是像素化的。在 Chrome 中,可以正确呈现。可能是什么问题呢?

图片:blurriness

这是从图标所在的 :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%;
}

最佳答案

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


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

工具 > 选项 > 高级 > 常规 > 浏览:“可用时使用硬件加速”


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

关于html - Firefox 中的字形图标是像素化的,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37844170/

相关文章:

css - 将所有 <li> 设置为具有相同的宽度

未加引号的属性的 HTML 语法高亮显示

html - 使用 Twitter Bootstrap 的两列内联表单

html - 简单的 HTML + CSS 页面中出现奇怪的差距

jquery - 数据表上的滚动条样式

css - Rails -- CSS 导入规则

javascript - 如何制作 Bootstrap 选项卡 "auto play"

html - 无法在 bootstrap knockout 网页中的下拉列表旁边显示文本

html - 透明导航/菜单栏

javascript - 拖放标签列表元素