php - 使用 CSS 缩短元素的内容

Question

我有一个页面，其中介绍了最新的博客文章，并带有动态生成的“阅读更多”链接。

<div class="row">
    <div class="span3">
      <article>
        <div class="date">
          <span class="day">29</span>
          <span class="month">Oct</span>
        </div>
        <h4>
          <a href="#">How to make a blog</a>
        </h4>
        <p>
          // content here
       </p>
       <a class="read-more" href="#">
          read more
          <i class="icon-angle-right"></i>
       </a>
     </article>
   </div>
   <div class="span3">
      <article>
        <div class="date">
          <span class="day">29</span>
          <span class="month">Oct</span>
        </div>
        <h4>
          <a href="#">How to make a Robot</a>
        </h4>
        <p>
          // content here
       </p>
       <a class="read-more" href="#">
          read more
          <i class="icon-angle-right"></i>
       </a>
     </article>
   </div>           
</div>

如何缩短此内容并在后面添加一些点。

JsFiddle here .

Answer 1

你可以在这里使用一些js

$.each($('article p'),function(i,v){
    if($(v).html().length > 100)
        $(v).html( $(v).html().substr(0,200) + "...");        
});

查看fiddle