2017-12-11 17 views
1

私は現在、イベントの完全な説明を与える<p>{{event.desc}}</p>を持っています。段落の文字数制限を設定するにはどうすればよいですか?

非常に長い説明があり、最初の50文字だけが必要です。

これはどのように達成できますか?

+0

のsubstr() - http://php.net/manual/bg/function.substr.php –

+0

あなたはangularjsを使用していますか?もしそうなら、これをチェックしてくださいhttps://docs.angularjs.org/api/ng/filter/limitTo –

+0

私はPHPを使用していません。 HTML&CSSソリューションはありませんか? –

答えて

1

これを試してみてください:

.fifty-chars { 
 
    width: 50ch; 
 
    overflow: hidden; 
 
    white-space: nowrap; 
 
    text-overflow: ellipsis; 
 
}
<p class="fifty-chars">Short event description</p> 
 
<p class="fifty-chars">Long long long long long long long long long 
 
    long long long long long long long long long long long long long 
 
    long event description</p>

+0

1行のコードを追加しました。 CSS: 'text-overflow:省略記号;'は、文字列が突然切り捨てられたものよりも優れた光学的結果を与えるでしょう。 –

関連する問題