CSSでテキストまるめ処理
長い文字列を省略して表示する
Rails
truncate というメソッドがありました。文字数を指定して文字列をまるめてくれます。
"20文字以上のテキストは、20文字で切り捨てられる".truncate(20)
=> "20文字以上のテキストは、20文字..."
CSS
CSSで行うと、文字列は幅に合わせて自動的に切り捨ててくれます。
.text-overflow{
width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
<p class="text-overflow">文字列は幅に合わせて自動的に切り捨てられるのです。</p>
表示結果
文字列は幅に合わせて自動的に切り捨てられるのです。