仅在带动画的Firefox上使文本模糊

时间:2018-10-15 14:05:07

标签: javascript css firefox antialiasing font-smoothing

尝试获取清晰的文字。 这段代码在chrome / IE上显示的是纯文本,但在Firefox上却不能显示,这出于某些原因使我看不清文本。

这是我的问题的再现:https://jsfiddle.net/z7egrnod/

有人能解决这个问题吗?我只是不明白怎么可能会有模糊的文字。

.skewContent {
height: auto;
-o-transform: skewY(-6deg);
-moz-transform: skewY(-6deg);
-ms-transform: skewY(-6deg);
-webkit-transform: skewY(-6deg);
transform: skewY(-6deg);
transform-origin: top left;
overflow: visible;
}

.skewContent#toolbox {
    margin-top: -110px;
    outline: 1px solid transparent;
}

.containerSkew .skewFix {
-o-transform: skewY(6deg);
-moz-transform: skewY(6deg);
-ms-transform: skewY(6deg);
-webkit-transform: skewY(6deg);
transform: skewY(6deg);
}

chrome上的图片示例:

ON chrome

firefox上的图片示例:

ON Firefox

0 个答案:

没有答案