[tintuc]
Thủ thuật blogger dùng CSS cắt chuỗi tiêu đề cho blogspot, sử dụng cách này chúng ta có thể cắt chuỗi văn bản của tiêu đề bài viết thành 1 hàng, 2 hàng hoặc 3 hàng.
Áp dụng cho trường hợp tiêu đề bài viết hoặc đoạn văn của blog trang web quá dài, thì bạn có thể sử dụng cách sau:
Cách 1: Cắt tiêu đề hoặc đoạn văn chỉ nằm trên 1 dòng
.catchuoi1hang {
overflow: hidden; // Ẩn tiêu đề hoặc đoạn văn bản bị thừa
white-space: nowrap; // Không cho tiêu đề hoặc đoạn văn xuống dòng
text-overflow: ellipsis; // Thay tiêu đề hoặc đoạn văn bản bị thừa bằng dấu 3 chấm ...
}
Tùy vào từng bố cục html, bạn có thể thêm width cho nó.. nếu cần thiết
.catchuoi1hang {
overflow: hidden; // Ẩn tiêu đề hoặc đoạn văn bản bị thừa
white-space: nowrap; // Không cho tiêu đề hoặc đoạn văn xuống dòng
text-overflow: ellipsis; // Thay tiêu đề hoặc đoạn văn bản bị thừa bằng dấu 3 chấm ...
width: 600px;
}
Cách 2 : Cắt tiêu đề hoặc đoạn văn bản thành nhiều hàng
.catchuoinhieuhang {
overflow: hidden;
text-overflow: ellipsis;
line-height: 25px;
-webkit-line-clamp: 3; // Số hàng của tiêu đề hoặc đoạn văn muốn hiển thị
height: 75px;
display: -webkit-box;
-webkit-box-orient: vertical;
width: 600px;
}
Tùy vô bố cục của từng html của blog, các bạn chỉnh các thông số màu đỏ cho phù hợp...
[/tintuc]
Không có nhận xét nào: