}

Thủ thuật blogger dùng css cắt chuỗi tiêu đề cho blogspot

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...

X

Bạn cần tư vấn ?