
cssで長すぎる文字列を省略して末尾を…(三点リーダー)にする、text-overflow: ellipsis;の使い方
DEMO
html
<p class="text-overflow-demo">cssで長すぎる文字列を省略して末尾を…(三点リーダー)にする、text-overflow: ellipsis;の使い方</p>
css
p.text-overflow-demo{
width: 300px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
今までjsでやらなきゃいけないと思っていたので、cssだけでできるのはとても効率がいいですね!
ただ、複数行はできないのでjsでやることになりそうです。


コメント