[Hướng dẫn] giới hạn ký tự tiêu đề dài và thêm (...) ở cuối

avatar

blogger57
174
27
blogger
An toàn
cập nhật
Thành viên quen thuộc
Thành viên quen thuộc

Bài viết :
57
Points :
174
Like :
27
blogger
An toàn
cập nhật
Dạo qua BlogspotBloggerCommunity có thím ‎Thỏ Sạch Sóc Sơn‎ hỏi về cắt ký tự dài . Tiện đây hướng dẫn vào đây cho bạn ý dễ hình dung.



VD:

Code:
<a href="url"><span style="padding: 5px;" class="label_title">cộng đồng hotrofm</span></a>

<h2>Cách 1 sử dụng script</h2>

Code:
<script>$(".label_title").each(function(){if ($(this).text().length > 50) {$(this).text($(this).text().substr(0, 50));$(this).append('...');}});</script>

<h2>Cách 2 sử dụng css</h2>
Với trường hợp này ta dùng css như sau

Code:
.label_title {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 50px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;

}

Trong đó -webkit-line-clamp: 2; là số dòng là 2


VD: Ở đây ta thấy label_title ở website thỏ của bác ấy thì ta chỉ cần đổi class là dc thôi



Code:
.label_title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 350px;
}


Khi đã thay class trùng với class của các bạn thì các bạn vào Chủ đề cho vào phần

Code:
<style type='text/css'>........</style>


 Trả lời bài viết
Điểm 4.6/5 dựa vào 87 đánh giá

Có Thể Bạn Quan Tâm

Đang tải...