Php

Question

我有一个基于 wordpress 的网站，上面有电影和其他东西的情节，我只想摘录这些情节，如果情节没有的话，它们看起来像 "Word word word word..." 最后加点'适合容器。所以我想 php 中没有办法知道文本是否适合容器，但我该怎么做才能像我描述的那样制作某种摘录？如果唯一的解决方案只是选择一些字符并将其设置为限制，我如何找到这个数字？提前致谢

Answer 1

您可以为此使用自动换行功能，它会自动在给定长度的字符串中插入新行..

http://php.net/manual/en/function.wordwrap.php

<?php
$text = "The quick brown fox jumped over the lazy dog.";
$newtext = wordwrap($text, 20, "<br />\n");

echo $newtext;
?>

输出

The quick brown fox<br />
jumped over the lazy<br />
dog.

如果你想更动态地做它取决于它的容器宽度..你可以用 JS

来包装它

function wordwrap(str, int_width, str_break, cut) {
  var m = ((arguments.length >= 2) ? arguments[1] : 75);
  var b = ((arguments.length >= 3) ? arguments[2] : '\n');
  var c = ((arguments.length >= 4) ? arguments[3] : false);

  var i, j, l, s, r;

  str += '';

  if (m < 1) {
    return str;
  }

  for (i = -1, l = (r = str.split(/\r\n|\n|\r/))
    .length; ++i < l; r[i] += s) {
    for (s = r[i], r[i] = ''; s.length > m; r[i] += s.slice(0, j) + ((s = s.slice(j))
      .length ? b : '')) {
      j = c == 2 || (j = s.slice(0, m + 1)
        .match(/\S*(\s)?$/))[1] ? m : j.input.length - j[0].length || c == 1 && m || j.input.length + (j = s.slice(
          m)
        .match(/^\S*/))[0].length;
    }
  }

  return r.join('\n');
}

现在称其为

var container_width=20; // your div or container width
wordwrap('The quick brown fox jumped over the lazy dog.', container_width, '<br />\n');

Answer 2

如果您愿意使用 CSS，您可以将 content/description 包装在 div 中，具有以下属性：

.desc {
  display: -webkit-box;
  max-width: 400px;
  height: 109.2px;
  border: 1px red dashed;
  margin: 0 auto;
  margin-top: 1em;
  font-size: 26px;
  line-height: 1.4;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: .2em;
}

<div class="desc">Movie description follows here in the box containing a lot of text. This will be clipped. Movie description follows here in the box containing a lot of text. This will be clipped.</div>
<div class="desc">This will fit</div>

神奇的发生是由于text-overflow。

Answer 3

在 css 你有一个属性 for text-overflow: eclipse

所以你可以使用它。

<style>
#div1 {
    white-space: nowrap; 
    width: 12em; 
    overflow: hidden;
    text-overflow: clip; 
    border: 1px solid #000000;
}

#div2 {
    white-space: nowrap; 
    width: 12em; 
    overflow: hidden;
    text-overflow: ellipsis; 
    border: 1px solid #000000;
}
</style>


<p>This div uses "text-overflow:clip":</p>
<div id="div1">This is some long text that will not fit in the box</div>

<p>This div uses "text-overflow:ellipsis":</p>
<div id="div2">This is some long text that will not fit in the box</div>

你可以看出两者的区别。请参阅 demo 此处

Php - 根据容器大小减少文本长度

Php - Reducing text length depending on container size

wordpress

post

text

string-length