javascript – 为浏览器字体中的每个字符渲染pIxel宽度数据

前端之家收集整理的这篇文章主要介绍了javascript – 为浏览器字体中的每个字符渲染pIxel宽度数据前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个表格列,需要限制在一定的宽度 – 比如100像素.有时,该列中的文本比此更宽,并且不包含空格.例如:
a_really_long_string_of_text_like_this_with_no_line_breaks_makes_the_table_unhappy

我想计算文本服务器端的宽度,并在正确的字符数后添加省略号.问题是我没有关于文本的渲染大小的数据.

例如,假设浏览器是Firefox 3,字体是12px Arial.字母“a”的宽度,字母“b”的宽度等等是多少?

你有数据显示每个角色的像素宽度吗?还是一个生成它的程序?

我认为一个聪明的一次性JavaScript脚本可以做到这一点.但如果其他人已经这样做了,我不想花时间重新发明轮子.我肯定不是第一个遇到这个问题的人.

解决方法

这不仅不可能做服务器端,也没有意义.您不知道客户端将使用哪种浏览器,并且您不知道客户端上的哪些字体设置将覆盖您为一段HTML分配的任何样式信息.您可能认为在样式属性中使用绝对定位像素,但客户端可能只是忽略这些像素或使用某些插件来缩放所有内容,因为客户端使用高dpi屏幕.

使用固定宽度通常是个坏主意.

猜你在找的JavaScript相关文章