【问题标题】:Truncate text if it atempts to run into three lines如果文本试图进入三行,则截断文本
【发布时间】:2010-05-26 05:12:55
【问题描述】:
我有一个小<p> 大约 140 像素宽对齐在图片旁边。总共有四行文本的空间。前两行保留标题,还有两行其他信息。
如果标题跨越两行以上,我希望将其剪切,否则它将使其他信息与图像底部不一致。
我能想到的唯一解决方案是创建一个两行高度的 div,并隐藏溢出。但是,如果标题只有一行,就会留下很大的空白。
解决方案可以是 Jquery、纯 javascript、CSS 甚至 PHP(如果可能的话)。
TIA
【问题讨论】:
标签:
javascript
jquery
css
truncate
【解决方案2】:
请记住,属性 max-height 在 IE6 中不受支持。此外,限制文本框的大小可能会导致可访问性问题,一般不建议这样做。
由于这更多的是内容问题而不是显示问题,因此最好在后端处理它 - 如果它是动态文本,请将您的数据库字段限制为适当的字符数,或者使用一些 php (或您设置的任何服务器端情况)。很难用非等宽字体建立字符数,但如果你不在内容方面限制它,你就有可能让那些可能使用不缩放的旧浏览器的视觉倾向较小的用户感到不安都喜欢最新版本的 safari 和 chrome。