这似乎只与 Safari 有关,但当我激活 bxSlider 时,字体粗细会发生变化……在 Chrome 和 Firefox 中一切看起来都很棒。有什么我可以添加到我的 css 来解决这个问题的吗?左边的图像是 Safari 问题...右边的图像是它应该看起来的样子...我已经尝试了 OSX-Only Fix、-Webkit-Text-Shadow Hack 和 -Webkit-Text -Stroke Hack 提到:https://blakepetersen.io/how-to-clean-up-chrome-and-safaris-webfont-rendering/ .我不认为这与 bxSlider 特别相关,因为文本在其他浏览器中看起来很好。
我的页面位于:http://joshrodg.com/hallmark/ (蓝色部分朝向底部)-还有其他人看到了吗?
谢谢,
乔希
最佳答案
因此,对于这个问题,我找不到解决方案(除了保持原样)。
我看到一个解决方案提到浏览器与动画混淆,因此文本呈现不正确。要解决此问题,您可以添加相对位置和 z-index。 z-index 应该高于带有动画的类的 z-index。看了之后,我无法弄清楚是哪个类(class)在表演动画。我尝试添加 z-index,但文本并没有恢复正常。
我最终做的正是我在上一篇文章中提到的...在 .bx-viewport
上我添加了 -webkit-text-stroke: 0.30px;
。我喜欢这个解决方案,因为 webkit
前缀主要影响 Safari 浏览器(我在其中看到了问题)。
因为我没有遇到任何其他有效的方法,所以我将使用它作为我的解决方案。
关于javascript - Safari 在 bxSlider 上改变字体粗细,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35589333/