我在我的网络应用程序中集成了 Bootstrap 。在 Firefox 中,所有字形图标在任何字体大小下都是像素化的。在 Chrome 中,可以正确呈现。可能是什么问题呢?
这是从图标所在的 :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 中禁用或启用硬件加速。
工具 > 选项 > 高级 > 常规 > 浏览:“可用时使用硬件加速”
关于html - Firefox 中的字形图标是像素化的,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37844170/