将文本限制为仅两行

Question

我想在html电子邮件中将文本限制为150px宽度表的固定行数,例如:

Long text continues down the road into a lane and doesn't stop there

我希望它看起来像这样:

Long text continues down 
the road into a lane and...

我正在截断字符串最多45个字符,包括省略号,但有时当一个长字出现时它会变为三行:

Long text continues at
accelerating speed into the
road...

理想情况下,我想打破加速这个词,或者在第一行填充尽可能多的字符并继续第二行,有没有办法在html中执行此操作？(我查看了自动换行,但显然并非所有电子邮件客户端都支持)

此外,由于这是电子邮件客户端,我也不能做任何javascript等.

Answer 1

CSS解决方案

你可以设置一个高度并隐藏溢出.

span {
    display: inline-block;
    border: black 1px solid;
    width: 300px;
    height: 40px;
    overflow: hidden;
}

示例:http://jsfiddle.net/imoda/REs2Q/

PHP解决方案

服务器端的替代方案是使用 substr

<?php

    $string = "Oh squiggly line in my eye fluid. I see you lurking there on the peripheral of my vision. But when I try to look at you, you scurry away. Are you shy, squiggly line? Why only when I ignore you, do you return to the center of my eye? Oh, squiggly line, it's alright, you are forgiven.";

    echo charlimit($string, 100);

    function charlimit($string, $limit) {

        return substr($string, 0, $limit) . (strlen($string) > $limit ? "..." : '');
    }

?>

示例:http://codepad.org/OetkaMh6

这将输出100个字符串,然后附加... Trick,这是你必须将字符数改为最适合你情况的字符数.因为它是服务器端,所以它不会知道在每个场景中只触发一次回车所需的字符数.

或者,您可以限制单词数量:

<?php

    $string = "Oh squiggly line in my eye fluid. I see you lurking there on the peripheral of my vision. But when I try to look at you, you scurry away. Are you shy, squiggly line? Why only when I ignore you, do you return to the center of my eye? Oh, squiggly line, it's alright, you are forgiven.";

    echo wordlimit($string, 20);

    function wordlimit($string, $limit) {

        $overflow = true;

        $array = explode(" ", $string);

        $output = '';

        for ($i = 0; $i < $limit; $i++) {

            if (isset($array[$i])) $output .= $array[$i] . " ";
            else $overflow = false;
        }

        return trim($output) . ($overflow ? "..." : '');
    }

?>

示例:http://codepad.org/WYJFPaD5

但它是一样的,你必须定制它"最合适"

希望有所帮助.