Tìm theo từ khóa

CSS, Thủ thuật

Giới hạn dòng hiển thị bằng CSS hỗ trợ cả IE

Aiken Trung 25/06/2021 Leave a comment 6851 Views Xem & chỉnh code online

Dùng đoạn CSS sau để gới hạn số dòng trong khung text nhé.

.codfe-archive-except{	
   word-break: break-word;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 24px; /* fallback */
   max-height: 72px; /* fallback */
   -webkit-line-clamp: 3; /* number of lines to show */
   -webkit-box-orient: vertical;
}

1

2

3

4

5

6

7

8

9

10

.codfe-archive-except{

word-break: break-word;

overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;

line-height: 24px; /* fallback */

max-height: 72px; /* fallback */

-webkit-line-clamp: 3; /* number of lines to show */

-webkit-box-orient: vertical;

}

Trong ví dụ trên thì nội dung trong class “codfe-archive-except” chỉ hiển thị 3 dòng, nội dung thừa sẽ bị cắt đi

5/5 - (1 bình chọn)

Bài viết mới:

Bài viết cùng chủ đề:

Aiken Trung

Hệ thống, đúc kết lại những gì mình học và làm rồi chia sẻ

0 0 đánh giá

Đánh giá bài viết

Theo dõi

0 Góp ý

Mới nhất

Cũ nhất Được bỏ phiếu nhiều nhất

Phản hồi nội tuyến

Xem tất cả bình luận

0

Rất thích suy nghĩ của bạn, hãy bình luận.x

()