相关疑难解决方法(0)

如何防止CSS过渡期间Webkit文本呈现更改

我正在使用CSS转换来在CSS转换状态之间转换(基本上转换元素的比例).我注意到,当元素转换时,页面上的其余文本(在Webkit中)倾向于稍微改变其呈现,直到转换完成.

小提琴:http://jsfiddle.net/russelluresti/UeNFK/

我还注意到,我的标题上没有这种情况,标题上有-webkit-font-smoothing: antialiased属性/值对.所以,我想知道,有没有办法让文本保持默认外观(字体平滑的"自动"值),而不是在转换过程中改变渲染.

我已经尝试明确设置文本使用"自动"值,但这没有做任何事情.我还应该注意,将字体平滑设置为"无"也会阻止渲染在转换期间闪烁.

任何帮助表示赞赏.

编辑1

我应该注意到我使用的是OS X.在浏览Parallels的Chrome测试时,我没有看到两个不同的段落表现不同,所以这可能是Macs独有的问题.

css webkit css3 css-transitions css-transforms

80
推荐指数
6
解决办法
7万
查看次数

使用css强制抗锯齿:这是一个神话吗?

最近一位客户抱怨IE6中出现了系统字体.基本上问题是IE6不支持字体平滑/抗锯齿(我知道你可以在OS设置或其他东西中打开它).但有人抛弃了这个宝石:

"你可以使用pt而不是px强制css中的字体反别名."

我在各种浏览器中做了一个快速的POC,并没有看到任何区别.我在网上发现了一个对它的引用,这篇论坛的最后一篇文章:

http://www.webmasterworld.com/css/3280638.htm

这听起来像是一个网络开发者城市神话,我的感觉是它的BS.有没有人遇到过它?

css fonts

61
推荐指数
6
解决办法
12万
查看次数

CSS - 在黑背景的白色文本,看起来更加大胆

在黑色背景上使用白色文本时,文本看起来比应该看起来更胖.它的纯文本与CSS.我正在使用typekit.org字体.

在此输入图像描述 在此输入图像描述

有没有办法解决这个问题,还是某种抗锯齿问题?

css fonts background bold

21
推荐指数
2
解决办法
2万
查看次数

Firefox中的字体平滑

使用Google WebFonts(在本例中为"Oswald"),我发现我的字体比它们应该更大胆.我使用以下方法在基于webkit的浏览器中解决了这个问题

-webkit-font-smoothing: antialiased;
Run Code Online (Sandbox Code Playgroud)

但在Firefox中我找不到控制它的声明.我听说使用text-shadow黑客来解决这个问题,但我不想使用它,因为它无疑会改变字体的几何属性.

以下是webkit(Chrome)中的内容:

Chrome看起来不错

这是由于Firefox的块状可怕渲染:

火狐难看

我知道有一种方法可以在FireFox中实现这一点,因为我在font-combinator.com上找到了这个字体,并且它使用Firefox在font-combinator上正确呈现.以下是通过font-combinator.com在Firefox上看起来的样子:

在Font-combinator.com上使用firefox

在浏览用于创建font-combinator的css之后,我发现了这个声明:text-rendering: optimizelegibility;但是当应用于我的元素时这不起作用.

我也尝试过:

text-rendering: optimizeLegibility;
text-rendering: geometricPrecision;
font-smooth: always;
font-smooth: never;
font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
Run Code Online (Sandbox Code Playgroud)

我怎样才能让Firefox对我的字体进行抗锯齿处理,以便它们在显示时看起来正确?您能找到使它们在www.font-combinator.com上正确显示的声明或声明组合吗?

我使用的是相对旧版本的FireFox(16.0.2),因为这台机器安装了旧版本的OSX.

css macos firefox fonts rendering

10
推荐指数
2
解决办法
3万
查看次数

如何使自定义css字体渲染与设计完全一样

我正和一些非常棒的设计师合作.在翻译他们的设计时,他们问我为什么有时候我们不会完全按照他们的设计中描述的那样渲染非系统字体.可以在附加到此问题的图像中显示最近的示例(忽略红色注释):

在此输入图像描述

我通过javascript include使用fonts.com中的字体,这允许我在我的CSS中使用新的font-family.我想提请你注意两件事:

a)在左侧,注意描述文本"努力......"比"Lorem ipsum ......"更大胆.字体是"Droid Serif W01 Italic".

b)在右边,注意"MEET ONE"比"COMMERZBANK"更大胆.字体系列为"UniversLTW01-57Condense 723821".

我确定font-weight:normal.然而,在某些计算机上看起来仍然看起来很大胆......而且它似乎取决于你所使用的操作系统和浏览器.似乎我能够以美学上令人愉悦的方式修改这些字体的重量的唯一方法是选择字体系列的另一种变体,如倾斜或浓缩版本(如果它们存在).但有时候,我仍然无法在所有不同的操作系统和浏览器组合上正确渲染.

你们是如何解决这些问题的?是否有技术可以使字体完全按照设计中的描述进行渲染,无论观察者操作系统和浏览器如何?

css fonts

7
推荐指数
1
解决办法
5526
查看次数