是否有跨浏览器方式来压缩页面上的文本？

我正在寻找一种方法来压缩页面上相对较小的文本区域,以模仿使用非标准字体完成的图形按钮.理想情况下,只是字母会被压扁或变得更薄,使字之间的空间大致相同.我知道有一些CSS属性可以做这样的事情,但是它们更侧重于字母之间的间距而不是字母宽度本身.这些CSS方法也不是非常跨浏览器友好.大多数用户群都在使用IE6,因此对基于CSS的方法提出了很大的限制.

那么,有没有办法控制跨浏览器友好的字符宽度/间距？我知道jQuery可以在浏览器中很好地工作,所以这可能是通过操纵字母的位置和可能的宽度来完成的吗？这些是一小段文本,一次5个单词,所以速度是可以在以后处理的东西.

编辑:好的,所以,CSS字母间距属性,以及字间距属性将允许我控制字母/单词之间的空格.然而,这使事情看起来很紧张.如果这真的是唯一的选择,那么我必须让它工作,但我真正想要的是一种方法来压缩字母本身,使字符更薄.

也许

letter-spacing:-1px

会有所帮助

简短回答:我认为没有符合您要求的跨浏览器示例.

CSS3规范包含一个font-stretch属性,但遗憾的是,CSS3目前几乎不支持(如果有的话).

一些可以模仿我可以想到的行为的方法:

使用基于闪存的方法,如sIFR

使用类似于Typeface.js的基于javascript/canvas的方法.示例页面上包含一个font-stretch示例

使用压缩字体(icky-approach,因为这意味着您依赖于客户端可用的字体),如Arial Narrow.

使用从文本参数生成图像的服务器端脚本

简而言之,这个问题没有简单而优雅的解决方案,因为文本和图像处理通常是您在图形编辑器中执行的操作.

如果这是不可能的,我肯定会建议查看Typeface和sIFR.